قالب موقع ويب
Shadcn Dashboard and Landing
Admin dashboard plus a matching landing page, shipped in both a Next.js and a Vite build of the same design.
وصف هذا القالب غير متوفر بالعربية بعد، لذلك يظهر بالإنجليزية.
Landing Page · Dashboard · مجاني
الصفحات
لقطات من العرض المباشر، صفحة تلو الأخرى. مرّر داخل الصفحة لرؤيتها كاملة.
تحليل التصميم
قراءة بالذكاء الاصطناعي لتصميم هذا القالب: الألوان والخطوط والمسافات والأقسام والتفاصيل المميزة. يبدأ منها Ottermind عند استخدام القالب.
هذا التحليل غير متوفر بالعربية بعد، لذلك يظهر بالإنجليزية.
- Overall
Admin dashboard, professional, medium density, light
- Palette
background #ffffff; surfaces [#fafafa, #171717, #e7000b, #009689]; text #0a0a0a; muted text #737373; primary #00a63e; accents [#e7000b, #009689, #f54a00]
- Type
headings Inter, 700, sentence-case; body Inter, 14px; scale h1 24px, h3 16px
- Shape & spacing
button/card radius 8px/14px, no borders, shadow rgba(0,0,0,0.1) 0px 1px 3px 0px, rgba(0,0,0,0.1) 0px 1px 2px -1px, section spacing 24px, content width 1200px max
- Sections (top to bottom)
- Header — horizontal layout, logo, search bar, navigation links, user actions, white background
- Hero — centered headline, subheading, two CTA buttons, white background
- Stats grid — four cards with metrics, trend indicators, and status labels, white background
- Charts row — two side-by-side cards: line chart (sales performance), donut chart (revenue breakdown), white background
- Transactions & Products — two columns: list of recent transactions with status tags, top products with ratings and stock levels, white background
- Customer Insights — tabbed view (Growth, Demographics, Regions), bar chart with dual-color bars, key metrics in card layout, white background
- Footer — centered attribution text, small font, light gray
- Signature details
- Rounded cards with subtle shadows
- Status badges in accent colors (red, green, orange)
- Dual-tone bar charts with contrasting data series
- Hover effects on interactive elements
- Clean, minimal typography with consistent spacing
- Tabbed interface for insights section
- Other pages
- /dashboard: admin dashboard with metrics and charts
- /landing: landing page with hero and features
- /auth-pages: authentication forms
- /errors: error handling pages
- /settings: configuration panel
تفاصيل القالب
- الفئة
- Landing Page, Dashboard
- المؤلف
- shadcnstore
- منشور على
- 21st.dev
- السعر
- مجاني
- Dashboard
- Landing Page
التصميم الأصلي من shadcnstore، منشور على 21st.dev. لا ينسخ Ottermind شيفرة القالب، بل ينشئ موقعًا جديدًا انطلاقًا من الموجز.
الموجز الذي يبدأ منه Ottermind
يُفتح في Studio كمسودة؛ أضف علامتك التجارية وجمهورك وصفحاتك قبل الإرسال.
Build a landing page website inspired by the "Shadcn Dashboard and Landing" template. Reference brief: Admin dashboard plus a matching landing page, shipped in both a Next.js and a Vite build of the same design. Use original copy and imagery for my brand rather than the reference's placeholder content.
كيفية استخدام هذا القالب
- 1
انقر على «استخدم هذا القالب» لفتحه في Ottermind Studio مع ملء الموجز.
- 2
أضف إلى الموجز علامتك التجارية وجمهورك وصفحاتك ومحتواك.
- 3
ينشئ Ottermind موقعًا جديدًا مستوحى من هذا التصميم، وتابع تعديله في المحادثة.
