Design & Development Studio Template

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

Overall

agency website, professional and minimalist mood, low density, light

Palette

background #f8f9fa; surfaces #ffffff, #f0f2f5; text #1a1a1a; muted text #6b7280; primary #3b82f6; accents #1e40af, #06b6d4, #8b5cf6

Type

headings Inter, 700, sentence-case; body Inter, 16px; scale h1 48px, h2 32px, h3 24px

Shape & spacing

button radius 8px, card radius 12px, borders 1px solid #e5e7eb, shadows 0 1px 3px rgba(0,0,0,0.1), section spacing 80px, content width 1200px

Sections (top to bottom)

• Hero — full-width banner with mountain image overlay, centered headline and subheadline, two CTA buttons, logo row below; background semi-transparent white overlay
• Client logos — horizontal grid of four brand logos with labels, centered under dotted line divider
• Process section — left-aligned heading and paragraph above a large illustration of design tools and interface mockups, with dark navigation bar at bottom showing "Geist", "Home", "Brand"

Signature details

• Semi-transparent overlay on hero image for text legibility
• Dotted horizontal divider between sections
• Rounded corners on all interactive elements
• Minimalist iconography in client logos
• Floating dark navigation bar over illustration
• Subtle drop shadow on cards and buttons

Other pages

• /work: gallery layout of project thumbnails
• /pricing: tiered pricing table with feature comparison
• /services: service cards with icons and brief descriptions

1. 1

   انقر على «استخدم هذا القالب» لفتحه في Ottermind Studio مع ملء الموجز.

2. 2

   أضف إلى الموجز علامتك التجارية وجمهورك وصفحاتك ومحتواك.

3. 3

   ينشئ Ottermind موقعًا جديدًا مستوحى من هذا التصميم، وتابع تعديله في المحادثة.