Inside the Specs website design
Specs is built with Shopify. Its pages are built from hero, features, gallery, FAQ, and footer sections, shown here in full-page captures and a scroll recording. Typography: Specs Sans. Palette: #402020, #006040, #606040.
Pre-order SPECS, AR glasses and smart glasses that bring computing into the world around you for work, learning, play, and hands-free experiences. Its visual style is minimal, photographic, and bold, with navigation bar, hero, and floating product card among its components.
Why we picked it
A grayscale fashion portrait fills the opening screen so the glasses read as a style object first, then a black band with the CEO keynote adds credibility before colour returns in the lens demo clips. Close-up product shots and a tidy FAQ accordion near the end let shoppers scan specs and answers without losing the calm, editorial mood.
What to look for
- Hero: a specific headline instead of a generic slogan
- Features: benefits framed around what the user gets, not internal capability names
- Gallery: minimal interface around the images
- FAQ: questions written the way customers actually ask them
Questions designers ask
What fonts does Specs use?
Specs uses Specs Sans, read from the fonts loaded on the captured page.
What is the Specs website built with?
The Specs website is built with Shopify, detected when the page was captured.
What colours does the Specs website use?
The captured palette includes #402020, #006040, and #606040.
What sections does the Specs website have?
The Specs website includes hero, features, gallery, FAQ, and footer sections. Each one opens on its own page, so you can compare it with the same section on other websites.
Can I use Specs's design for my own project?
Use it as a reference for structure, hierarchy, and style rather than something to copy. The DESIGN.md download summarises Specs's typography, colours, and components for your team or an AI tool.
