Design System
Gallery

Minimalist dark-mode productivity tool with monochrome black-and-white palette, bold sans-serif type, and a confident, snappy voice.

Your shortcut to everything.

Build on these tokens

Download the file and seed any AI tool — or install it into a real Next.js project so every generated page shares this palette, type, and shape.

Download raycast.mdthen, in your project:
$ npm i -g @getcoherent/cli
$ coherent import design raycast.md

Colour

#07080a
brand · body background
#ffffff
text · body text
#9c9c9d
neutral · button-secondary text

Typography

Families: Inter · Inter Fallback · sans-serif · GeistMono

display64pxw600/70.4px
body32pxw400/36.8px
small24pxw500/38.4px

Spacing

8px12px16px40px

Radius

0px
3px
4px
5px
6px
8px
11px
12px
16px
19px
20px
31px

Elevation

rgba(255, 255, 255, 0.15) 0px 1px 1px 0px inset
rgba(0, 0, 0, 0.5) 0px 0px 0px 2px, rgba(255, 255, 255, 0.19) 0px 0px 14px 0px, rgba(0, 0, 0, 0.2) 0px -1px 0.4px 0px inset, rgb(255, 255, 255) 0px 1px 0.4px 0px inset
rgba(245, 48, 107, 0.1) 0px 0px 20px 0px
rgba(255, 255, 255, 0.03) 0px 0px 40px 20px, rgba(255, 255, 255, 0.3) 0px 0.5px 0px 0px inset
rgba(255, 255, 255, 0.19) 0px 0px 2px 0px, rgba(255, 255, 255, 0.1) 0px 0.5px 0px 0px inset
rgba(0, 0, 0, 0.4) 0px 4px 40px 8px, rgba(0, 0, 0, 0.8) 0px 0px 0px 0.5px, rgba(255, 255, 255, 0.3) 0px 0.5px 0px 0px inset
rgba(0, 0, 0, 0.2) 0px 0px 1px 0px, rgba(0, 0, 0, 0.17) 0px 2px 2px 0px, rgba(0, 0, 0, 0.1) 0px 4px 3px 0px, rgba(0, 0, 0, 0.03) 0px 7px 3px 0px, rgba(0, 0, 0, 0) 0px 12px 3px 0px, rgba(0, 0, 0, 0.25) 0px 4px 4px 0px, rgba(255, 255, 255, 0.1) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.25) 0px 4px 4px 0px
rgba(0, 0, 0, 0.25) 0px 4px 4px 0px
rgba(0, 0, 0, 0.03) 0px 8.077px 3.462px 0px, rgba(0, 0, 0, 0.25) 0px 4.615px 4.615px 0px, rgba(255, 255, 255, 0.19) 0px 1.154px 0px 0px inset, rgba(255, 255, 255, 0.25) 0px 0px 6px 0px
rgba(0, 0, 0, 0.03) 0px 7px 3px 0px, rgba(0, 0, 0, 0.25) 0px 4px 4px 0px
rgba(0, 0, 0, 0.4) 0px 1.5px 0.5px 2.5px, rgb(0, 0, 0) 0px 0px 0.5px 1px, rgba(0, 0, 0, 0.25) 0px 2px 1px 1px inset, rgba(255, 255, 255, 0.2) 0px 1px 1px 1px inset, rgba(0, 0, 0, 0) 0px 0px 0px 0px inset
rgba(255, 255, 255, 0.1) 0px 1px 0px 0px inset

Gradients

linearlinear-gradient(137deg, rgba(17, 18, 20, 0.75) 4.87%, rgba(12, 13, 15, 0.9) 75.88%)
conicconic-gradient(from -80deg at 0px 15px, rgba(0, 0, 0, 0) 0deg, rgb(236, 165, 167) 20%, rgba(0, 0, 0, 0) 25%)
radialradial-gradient(85.77% 49.97% at 51% 5.12%, rgba(255, 150, 150, 0.11) 0px, rgba(222, 226, 255, 0.08) 45.83%, rgba(241, 242, 255, 0.02) 100%)
linearlinear-gradient(rgb(255, 99, 99), rgb(215, 42, 42))
linearlinear-gradient(135deg, rgb(86, 194, 255) 0%, rgb(19, 138, 242) 100%)
linearlinear-gradient(181deg, rgba(0, 0, 0, 0.1) 4.5%, rgba(255, 255, 255, 0.03) 99.51%)
linearlinear-gradient(137deg, rgb(17, 18, 20) 4.87%, rgb(12, 13, 15) 75.88%)
radialradial-gradient(79.21% 79.21% at 42.35% 0px, rgb(120, 120, 120) 0px, rgb(40, 40, 40) 100%)
radialradial-gradient(1139.98% 138.18% at 0px 0px, rgba(255, 255, 255, 0.1) 0px, rgba(255, 255, 255, 0) 100%)
linearlinear-gradient(rgba(0, 0, 0, 0), rgb(7, 8, 10) 50%)

Borders

1px solid #ffffff
1px solid #ffffff
1px solid #ffffff
1px solid #ffffff
2px solid #ffffff
4px solid #ff6363
1px solid rgba(0, 0, 0, 0)
1px solid #ffffff
1px solid #8e8c90
1px solid #ffffff
1px solid #434345
1px solid #2f3031

Motion

200mseasecolor
300mseasecolor
300mseaseborder
200mseasetransform
300mseaseheight
300mseasetransform
200msease-in-outall
200mseasebackground-image
200mseasebackground-color
200msease-in-outbox-shadow
100msease-in-outtransform
200mseaseall
300mseaseall
400mscubic-bezier(0.23, 1, 0.32, 1)opacity

Glassmorphism

blur(2px)

Surfaces

#07080a
page

Layout

Breakpoints
sm · 375pxmd · 520pxlg · 784pxxl · 1050px
Container widths
540px
z-index ladder
123
Extracted from live CSS by Coherent (dark mode). Numeric fields reflect the site at capture time; roles and the summary are inferred. Tokens and prose only — a description, not a copy.
Save raycast.md to your device

Open it on your desktop to run the CLI.