قالب موقع ويب

Modernize Free React MUI Dashboard

Free React + MUI admin dashboard template with a professional layout and easy customization for faster development.

وصف هذا القالب غير متوفر بالعربية بعد، لذلك يظهر بالإنجليزية.

Dashboard · Starter Kit · مجاني

فتح العرض المباشر عرض مستودع الشيفرة

الصفحات

لقطات من العرض المباشر، صفحة تلو الأخرى. مرّر داخل الصفحة لرؤيتها كاملة.

قالب الموقع Modernize Free React MUI Dashboard، صفحة /، الجزء 1 — /Dashboard

تحليل التصميم

قراءة بالذكاء الاصطناعي لتصميم هذا القالب: الألوان والخطوط والمسافات والأقسام والتفاصيل المميزة. يبدأ منها Ottermind عند استخدام القالب.

هذا التحليل غير متوفر بالعربية بعد، لذلك يظهر بالإنجليزية.

Overall: admin dashboard, professional, medium density, light
Palette: background #ffffff; surfaces [#5d87ff,#3772ff,#49beff,#13deb9]; text #2b2b2b; muted text #2a3547; primary #5d87ff; accents [#3772ff,#49beff,#13deb9]
Type: headings Plus Jakarta Sans, 600, sentence-case; body Plus Jakarta Sans, 14px; scale h3 24px
Shape & spacing: button/card radius 50px, no borders, subtle shadows, section spacing 24px, content width 1200px
Sections (top to bottom): Header — horizontal layout, dark blue top bar with logo, navigation, and user actions; white main header with brand name, notification bell, CTA buttons, and profile avatar
Sidebar — vertical left sidebar with collapsed menu items, icons, and Pro labels on some items; white background with blue active state
Main Dashboard — two-column grid: left side has bar chart (Sales Overview) with date selector; right side has Yearly Breakup with circular progress indicator and Monthly Earnings with wave line graph
Content Grid — two equal-width columns: Recent Transactions (timeline list with colored dots) and Product Performance (table with priority tags in color-coded pills)
Product Cards — four horizontally aligned cards with product images, titles, prices, ratings, and settings icon; each card has a soft shadow and rounded corners
Signature details: Blue gradient pill-shaped priority indicators (Low/Medium/High/Critical)
Circular progress ring for yearly breakup
Timeline dots in varying colors (blue, teal, orange) for transaction types
Hoverable product cards with gear icon overlay
Clean, minimal spacing with consistent padding
Rounded corner buttons and cards with 50px radius
Other pages: /dashboard: main analytics view with charts and tables
/eCommerce: product management interface
/frontend-pages: UI component showcase

تفاصيل القالب

الفئة: Dashboard, Starter Kit
المؤلف: adminmart
منشور على: 21st.dev
السعر: مجاني

Dashboard
Admin Panel
Boilerplate

التصميم الأصلي من adminmart، منشور على 21st.dev. لا ينسخ Ottermind شيفرة القالب، بل ينشئ موقعًا جديدًا انطلاقًا من الموجز.

الموجز الذي يبدأ منه Ottermind

يُفتح في Studio كمسودة؛ أضف علامتك التجارية وجمهورك وصفحاتك قبل الإرسال.

Build a dashboard website inspired by the "Modernize Free React MUI Dashboard" template. Reference brief: Free React + MUI admin dashboard template with a professional layout and easy customization for faster development. Style and features to reflect: Admin Panel, Boilerplate. Use original copy and imagery for my brand rather than the reference's placeholder content.