design system · v1.0

scantir tokens.

the primitives. copy the css variables from tokens.css — that file is the source of truth.

kit · v1.0 · apr 2026

color

one accent. ten neutrals. four statuses. nothing else earns a slot.

the accent

lime · dark

focus rings · hover trails

#5A7300

lime · dim

strings in code

#AFD900

lime

the one true accent

#CCFF00

lime · glow

hover on primary cta

#E4FF5C

neutrals · 10-step scale · near-black to bone

void

#0A0B0D

canvas

ink

#111217

bg-1

carbon

#1A1C22

bg-2

graphite

#23262E

bg-3

steel

#2E323C

border

slate

#4A4F5C

border-hi

mist

#7A8093

fg-mute

chalk

#B8BDC9

rarely

bone

#E8EAEF

fg · default text

paper

#F6F7F9

inverse surfaces

status

200s · success

#5EE4A8

warn

429 · retrying

#FFB547

err

4xx · 5xx

#FF6363

info

keywords · nums

#6CB5FF

type

space grotesk for display. jetbrains mono for everything else. two weights each. no italic except for emphatic lime accents.

display · space grotesk · 500

ship anything.

72 / 68 · -0.03emused: hero · section heads

display · medium

scrape the hard stuff

48 / 50 · -0.025emused: section titles

display · lg · 24

clean json, not html.

card titles

body · mono · 14

one endpoint. captchas handled. you get clean json back in ~200ms p50.

default body

eyebrow · mono · 11 · uppercase

01 — the toolkit

section kickers

mono · lg · 18

$ curl api.scantir.dev

command lines

caption · mono · 13

req_01HF3X9Z2A · 204ms

metadata

micro · mono · 10 · tracked

// file system

labels · chrome

spacing & radius

4px base · increments double until 16 · radii stop at 6.

2xl

3xl

4xl

5xl

r-0

tables · chrome

0px

r-1

buttons · inputs

2px

r-2

panels · cards

6px

r-full

pills · toggles

∞

components

the building blocks. hover everything.

buttons · lowercase · sharp

pills · status chips

200 · ok429 · retrying500 · failedstreaming

v2.1.0betaus-eastsession · user-42

input · focus shows lime ring

render jsfollow redirects

metric · display face with accent

99.4%

cloudflare solve rate · 30d

terminal · hero variant

$ scantir scrape \
--url target.com/p/42
✓ 200 in 247ms

alert · left-border on feature

TIP
use session_id to reuse proxies.

toggle · lime on

monthlyannual

effects & motion

subtle glow on lime. sharp transitions. one ease curve: out-expo.

glow · on accent surfaces

0 0 32px rgba(204,255,0,0.4)

grid backdrop · 48px tile

the identity layer

scanlines · crt overlay

SIGNAL ACQUIRED

use sparingly · hero-only

reference · css variables

every primitive, lifted from tokens.css. import and go.

--void: #0A0B0D; /* canvas */

--ink: #111217; /* bg-1 */

--carbon: #1A1C22; /* bg-2 */

--lime: #CCFF00; /* the accent */

--lime-glow: #E4FF5C; /* hover */

--lime-ink: #1A1E00; /* text on lime */

--bone: #E8EAEF; /* default text */

--f-display: 'Space Grotesk', ui-sans-serif, sans-serif;

--f-mono: 'JetBrains Mono', ui-monospace, monospace;

--r-1: 2px; --r-2: 6px; --r-full: 9999px;

--ease: cubic-bezier(0.2, 0.9, 0.3, 1);

--tick: 120ms;