Mac mini
Immaculately engineered and hyper-minimalist. Clinical industrial product photography is framed by vast negative space, neutral grey tones, and razor-sharp typographic hierarchy. Subtle colored gradient cards and vibrant chip callouts inject calculated energy without breaking the restrained composition.
Visit siteColour
Background#ffffff
Text#1d1d1f
Accent#0066cc
Surface#f5f5f7
Muted#6e6e73
Typefaces
- Display
- SF Pro Display
- Body
- SF Pro Text
- Mono
- —
- Source
- self_hosted
- Scale
- 12 · 14 · 17 · 19 · 21 · 24
Layout
- Grid
- —
- Container
- —
- Spacing base
- 4px
- Radius
- 18px · 24px · 999px
Capture
- Category
- tools
- Sections
- 17
- Captured
- 2026-08-30
- Rhythm
- light grey → white → light grey → white → warm grey x2 → white → light grey x2 → white → pink tint → dark → white → light grey x2 → white → light grey
Type rules
- display typography set tight with negative tracking and sentence case
- subheads and category eyebrows use medium weight sentence-case labels
- body copy centered under hero headers and left-aligned in multi-column feature cards
Colour rules
- canvas alternates between pure white (#ffffff) and subtle cool/warm grey surfaces (#f5f5f7, #faf7f4)
- accent blue (#0066cc) strictly reserved for interactive CTAs, links, and inline text emphasis
- deep dark surfaces used selectively to spotlight AI and operating system features
Voice rules
- headlines rely on short rhythmic phrases or paired contrast words
- feature descriptions remain concise, factual, and benefit-driven
Holds it together
- hero displays feature product rendering dead-center with large sentence-case headline above
- primary calls to action rendered as full-pill buttons in high-contrast blue or dark fill
- specifications and port details presented with floating minimal typography directly adjacent to hardware renders
- cards and interactive containers use generous inner padding and large rounded corner radii
Contrast
text on background16.8:1 AAA
muted text on background5.1:1 AA
text on surface15.5:1 AAA
accent on background5.6:1 AA
background on accent5.6:1 AA
Type, measured
- Body
- 12px / 1.33
- Measure
- 174 characters
- Display
- 80px / 1.05
- Tracking
- -0.015em display
- Scale ratio
- 1.61
Voice
- Tone
- declarative, confident
- Sentences
- short
- Person
- second
- Vocabulary
- plain
- Calls to action
- pre-order, shop, watch
Built with
- Builder
- —
- Framework
- —
- Motion
- —
- WebGL
- —
- Nav
- top_bar, 234 items
- Length
- 31 screens
Sections in page order
3 marked strong · 17- 00
hero
Crisp, engineered hardware presentation pairing massive typographic branding with high-fidelity product photography on a clean neutral canvas.
- Mood
- clinical + bold
- Layout
- 16 col · stacked · airy
- 01
feature
Precise, airy product statement pairing crisp typography with subtle color accents and expansive white space.
- Mood
- clinical + quiet
- Layout
- 7 col · centered · airy
- 02
showcase
An engineered, hyper-minimalist product transition showcasing precise geometric angles in cool monochromatic tones.
- Mood
- clinical + quiet
- Layout
- 14 col · asymmetric · airy
- 03
feature
Ultra-minimal product feature callout focusing on clean geometric shapes and crisp typographic detailing.
- Mood
- clinical + quiet
- Layout
- 12 col · split · airy
- 04
showcase
Crisp, engineered hardware specification callouts floating over dynamic angled monochrome color planes.
- Mood
- clinical + quiet
- Layout
- 14 col · asymmetric · airy
- 05
showcase
Stark vertical planes of monochromatic tone create a quiet, minimalist architectural showcase.
- Mood
- quiet + clinical
- Layout
- 16 col · asymmetric · airy
- 06
showcase
A pristine overhead product showcase framing creative desktop workflow with high-contrast split lighting and minimal typography.
- Mood
- clinical + quiet
- Layout
- 16 col · stacked · balanced
- 07
comparison
Crisp, engineered product showcase comparing chips and hardware performance with clinical precision and vibrant gradient typography.
- Mood
- clinical + bold
- Layout
- 16 col · grid · balanced
- 08
showcase
A meticulously engineered multi-panel product showcase using vertical rounded tabs to explore diverse workflows.
- Mood
- clinical + quiet
- Layout
- 11 col · grid · balanced
- 09
showcase
A clinical, high-polish product showcase featuring crisp typography, pill-based navigation tabs, and realistic hardware UI renders.
- Mood
- clinical + bold
- Layout
- 12 col · stacked · balanced
- 10
feature
StrongPolished tech feature layering crisp centered typography over ethereal translucent gradients and rounded dark cards.
- Mood
- dreamy + clinical
- Layout
- 16 col · stacked · balanced
- 11
feature grid
StrongCurved dark pill cards showcasing operating system software features with precise typography and bleeding interface previews.
- Mood
- clinical + quiet
- Layout
- 16 col · grid · balanced
- 12
statement
StrongA pristine, centered statement on privacy framed with signature Apple iconography transitions into a clean hardware and macOS display.
- Mood
- clinical + quiet
- Layout
- 1 col · stacked · airy
- 13
feature
Clean, high-craft Apple feature section pairing bold type with soft pastel card containers showcasing ecosystem synergy.
- Mood
- bold + clinical
- Layout
- 13 col · stacked · airy
- 14
showcase
Pristine overhead product photography frames clean, centered typography with an engineered, clinical balance.
- Mood
- clinical + bold
- Layout
- 12 col · centered · airy
- 15
comparison
A clean, modular bento comparison grid showcasing performance multipliers across pastel rounded cards.
- Mood
- clinical + bold
- Layout
- 8 col · grid · balanced
- 16
comparison
Clean, orderly product comparison and shopping perks presented in Apple's signature minimal rounded card system on a light grey canvas.
- Mood
- clinical + quiet
- Layout
- 10 col · stacked · balanced
