Cosmos
cosmos.soThe reference for a warm-linen (#f7f5f3) inspiration app whose entire hero is a free-floating scatter of rounded image tiles orbiting one dead-centre editorial headline, chrome kept invisibly monochrome so the imagery is the only colour.
Creative Tool flagship
Design tokens
background
surface
text
textMuted
accent
border
tone1
- display
- cosmosOracle
- body
- cosmosOracle
- mono
Do / Don't
Reference it for
- Linen-canvas base #f7f5f3 instead of pure white, warmer and reads like unprimed paper
- Scatter-collage hero: 20-plus small rounded image tiles (12px radius) floating around the edges, centred copy in the negative space they leave
- Dead-centre stack: tiny all-caps wordmark, huge sans headline (~74px), then a two-button row, all optically centred
- Large soft-weight headline (weight ~350, tight negative tracking) for editorial calm rather than marketing shout
- Button pair pattern: solid ink-black pill (#0d0d0d, white text) primary next to a borderless ghost text button
- Pill search bar centred in the nav with leading magnifier and trailing utility icons, floating white on the linen
- Strictly monochrome UI where the only chroma comes from user content (the image tiles), never from the interface
- Flat elevation: no drop shadows, depth carried purely by white cards sitting on the linen base
Do not copy
- The Cosmos hexagon-of-dots logomark
- The COSMOS wordmark and the exact 'Your space for inspiration' line
- The specific curated photo tiles used in the scatter (keyboards, sculptures, portraits)
- The 'Watch our film (ft. Odessa A'zion)' celebrity-teaser framing
- The cosmosOracle proprietary typeface (substitute a soft humanist sans)
- The exact tile positions and rotation seeds of the hero collage