Jaki jest kod hex causal.so?

Kolor akcentu na causal.so to #1a1a1a; tło strony to #f9f9f9, a główny kolor tekstu #1a1a1a. Każdy zmierzono na wyrenderowanej stronie, więc to jest to, co widzą odwiedzający, a nie wartość z przewodnika stylu.

Jak użyć kolorów causal.so w Tailwind lub CSS?

Skopiuj zmienne CSS lub motyw Tailwind v4 z tej strony albo pobierz pakiet designu: zawiera tokens.json (tokeny designu W3C), tokens.css i tailwind.css z tymi samymi wartościami.

Paleta kolorów causal.so: kody hex i CSS

Paleta

Kolory: 10

Kolory	Rola	Hex	RGB	Jasny / ciemny
`background`	Page background	`#f9f9f9`	`rgb(249 249 249)`	`#060606`
`surface`	Cards, panels, raised or recessed surfaces	`#e3e3e5`	`rgb(227 227 229)`	`#111111`
`surface-2`	Secondary surface	`#abdddf`	`rgb(171 221 223)`	`#3d2b1f`
`surface-3`	Secondary surface	`#d8d8d8`	`rgb(216 216 216)`	`#1a1a1a`
`foreground`	Primary text	`#1a1a1a`	`rgb(26 26 26)`	`#111111`
`muted-foreground`	Secondary text, captions	`#878787`	`rgb(135 135 135)`
`primary`	Candidate accent (semantic role inferred)	`#1a1a1a`	`rgb(26 26 26)`	`#e5e5e5`
`on-primary`	Text on the accent	`#ffffff`	`rgb(255 255 255)`	`#111111`
`secondary`	Secondary accent (amber)	`#ffc9a0`	`rgb(255 201 160)`	`#c98a74`
`border`	Hairlines, dividers, input borders	`#f2f2f2`	`rgb(242 242 242)`	`#f2f2f2`

Zmienne CSS

Każdy kolor jako custom property, nazwana według roli. Blok ciemny pojawia się, gdy strona ma ciemny motyw.

1:root {
2  --color-background: #f9f9f9;
3  --color-surface: #e3e3e5;
4  --color-surface-2: #abdddf;
5  --color-surface-3: #d8d8d8;
6  --color-foreground: #1a1a1a;
7  --color-muted-foreground: #878787;
8  --color-primary: #1a1a1a;
9  --color-on-primary: #ffffff;
10  --color-secondary: #ffc9a0;
11  --color-border: #f2f2f2;
12}
13
14[data-theme="dark"] {
15  --color-background: #060606;
16  --color-surface: #111111;
17  --color-surface-2: #3d2b1f;
18  --color-surface-3: #1a1a1a;
19  --color-foreground: #111111;
20  --color-primary: #e5e5e5;
21  --color-on-primary: #111111;
22  --color-secondary: #c98a74;
23  --color-border: #f2f2f2;
24}

Dla agentów AI

Pakiet to zwykły tekst, bez klucza: pobierz DESIGN.md albo przekaż cały pakiet do Claude Code, Cursor lub Copilot przez serwer MCP.

curl -s https://stylepack.ai/packs/causal.so/DESIGN.md

Paleta

Pytania

Jaki jest kod hex causal.so?

Jak użyć kolorów causal.so w Tailwind lub CSS?