BMW M

Difficulty:
Industry
bmw-m

Effect Preview

Style Description

Motorsport sub-brand. Near-black cockpit interface with BMW M tri-color accents

Tags

BMW MAutomotive

Prompt Template

Base Template
Design a BMW M-inspired interface. - Near-pure black canvas ({colors.canvas} — #000) with white type across the analyzed editorial and marketing pages. Configurator, account, checkout, and order-management flows are unresolved and may introduce light surfaces.; - Display headlines use UPPERCASE BMW Type Next Latin Light when following the BMW family system. Heavier uppercase settings are reserved for labels, buttons, card titles, and observed M-specific emphasis.; - M tricolor ({colors.m-blue-light} / {colors.m-blue-dark} / {colors.m-red}) used as 4px brand-stripe dividers, M-wordmark accents, and motorsport chrome — never as buttons or fills.; - Photography fills entire bands edge-to-edge. Cars are always the visual subject; UI chrome backs off to small white labels overlaid on photography.; - Buttons are flat with 0px corners and uppercase letterspaced labels. The "industrial precision" rectangular silhouette IS the brand..  Typography: (#ffffff):.

Variant Prompts

📱 Mobile
Design a mobile app with BMW M aesthetics. Clean, touch-friendly, native feel.
💻 Web
Design a web application with BMW M style. Professional, responsive layout.
📊 Dashboard
Design a dashboard with BMW M design language. Data-rich, organized, clear hierarchy.
📄 Landing Page
Design a landing page with BMW M visual identity. Compelling, conversion-focused.

Usage Examples

BMW M App

Web App
Build a web app with BMW M design language and brand color system.

BMW M Dashboard

Dashboard
Create a dashboard using BMW M style with data visualization and (#ffffff): typography.

Best For

  • Automotive
  • Brand-consistent interfaces
  • Modern web applications

Avoid For

  • Unrelated design aesthetics
  • Different brand guidelines