About Omega DESIGN.md
Curated by Dov AzencotUpdated Source omegawatches.com
- E-commerce & Retail
- Automotive
Omega's marketing site makes a move that no other Swiss watch brand makes in this extraction set: it puts the brand voltage directly in the headline. Section headings like "AQUA TERRA IN BLACK" and collection names render in crimson #c40d2e — a saturated, slightly dark red that appears 42 times across the captured page, predominantly as text and border color. Rolex holds its forest green out of headings entirely; Patek Philippe uses taupe only in secondary-label roles; Omega uses its crimson to name the watch before the photograph registers. The effect is that the product name carries a weight of announcement before visual context. Where you would normally read a watch name in charcoal or white, Omega renders it in the brand's red.
This DESIGN.md packages the system into a machine-readable spec using the Google Labs open format. Inside: 10 color tokens organized around a grey-dominant structural palette with crimson as the typographic voltage; 14 typography tokens all running the proprietary omegact typeface with aggressive letter spacing — 6.08px at 38px display, 7.68px at 48px — and weight 400 as the norm with weight 700 for uppercase labels and buttons; a near-flat radius vocabulary (50% circle on a single icon, 0px everywhere else); 8 spacing tokens derived from the extracted 3-15px rhythm; and 14 components covering the top nav, hero photography band, crimson section headings, body paragraphs, flat-text CTAs, newsletter input, and the watch-collection card grid.
Feed this file to an AI coding tool and it will reproduce Omega's specific choices: grey-dominant canvas with crimson headings, omegact-equivalent typeface at aggressive tracking, zero-radius architectural surfaces, flat-text actions instead of pill CTAs, and the newsletter input as the only form element on the marketing surface. The one move worth studying is the crimson-in-headings discipline — it works because the brand has sustained the red across decades of product identity; the same move with a newly-chosen accent would read as arbitrary.
What makes it distinct
- Crimson in headings#c40d2e appears as the text color for hero section headings and collection labels, not as a CTA fill; Rolex and Patek Philippe keep brand colors out of typography entirely
- omegact as a single-family systemevery surface from 10px nav labels to 48px display heads uses the proprietary omegact, with weight 400 for reading and weight 700 for emphasis
- No rounded corners anywherethe only radius in the system is a 50% circle on a single icon control; every button, card, and band is 0px sharp
- Flat-text buttonsthe primary action uses uppercase 13px text at 1.3px tracking with no background fill, no border, and no pill geometry
- Aggressive letter-spacing on display6.08px tracking at 38px and 7.68px at 48px, the widest display-tracking in the watch-brand set
Live at omegawatches.com
A snapshot of the brand in production. Hover the frame to scroll the page; click to visit.
omegawatches.comExplore Omega
Pick what you want to see — mockups, colors, typography, layout, or the full component list.
Brand & Accent
Sparing, CTA-only voltage.
Surface
Page and card backgrounds.
Text
Headlines, body, captions, muted.
Borders & Hairlines
Dividers, outlines, structural rules.
Other
Specialty colors.
Omega design system FAQ
Common questions about Omega's tokens, components, and how to use this DESIGN.md in your project.
Related reading
Specs, directories, and component libraries that pair with this design system.
Browse all design systems
The full directory of DESIGN.md files on shadcn.io, with live mockups for each.
Omega — official site
Omega's public marketing site — the source of truth for the live tokens captured in this file.
The DESIGN.md specification
Google Labs' open spec for machine-readable design system files — the format this page is built on.