feat: deep black dark + pure white light theme tokens
- Canvas: oklch(1 0 0) light / oklch(0 0 0) dark (true black) - Surface: oklch(0.98 0 0) light / oklch(0.07 0 0) dark - Ink: oklch(0.08 0 0) light / oklch(1 0 0) dark (pure white) - Ink-soft: oklch(0.40 0 0) light / oklch(0.72 0 0) dark - Border: oklch(0.92 0 0) light / oklch(0.17 0 0) dark - Accent: oklch(0.45 0.18 250) light / oklch(0.68 0.20 250) dark - Shadow-card updated for both modes
This commit is contained in:
@@ -6,12 +6,12 @@
|
||||
/* === Design Tokens === */
|
||||
@theme {
|
||||
/* Colors — Light mode defaults */
|
||||
--color-canvas: oklch(0.99 0 0);
|
||||
--color-surface: oklch(0.97 0.005 240);
|
||||
--color-ink: oklch(0.15 0.006 240);
|
||||
--color-ink-soft: oklch(0.45 0.008 240);
|
||||
--color-border: oklch(0.88 0.008 240);
|
||||
--color-accent: oklch(0.55 0.18 250);
|
||||
--color-canvas: oklch(1 0 0);
|
||||
--color-surface: oklch(0.98 0 0);
|
||||
--color-ink: oklch(0.08 0 0);
|
||||
--color-ink-soft: oklch(0.40 0 0);
|
||||
--color-border: oklch(0.92 0 0);
|
||||
--color-accent: oklch(0.45 0.18 250);
|
||||
|
||||
/* Fonts — override defaults */
|
||||
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
|
||||
@@ -30,7 +30,7 @@
|
||||
--text-5xl: 3rem; --text-5xl--line-height: 1.1;
|
||||
|
||||
/* Shadows */
|
||||
--shadow-card: 0 1px 3px rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
|
||||
--shadow-card: 0 1px 3px oklch(0 0 0 / 0.08);
|
||||
|
||||
/* Animations */
|
||||
--animate-fade-in: fade-in 0.3s ease-out;
|
||||
@@ -83,11 +83,13 @@
|
||||
|
||||
/* === Dark mode token overrides === */
|
||||
.dark {
|
||||
--color-canvas: oklch(0.12 0.02 240);
|
||||
--color-surface: oklch(0.18 0.02 240);
|
||||
--color-ink: oklch(0.96 0.005 240);
|
||||
--color-ink-soft: oklch(0.75 0.01 240);
|
||||
--color-border: oklch(0.28 0.025 240);
|
||||
--color-canvas: oklch(0 0 0);
|
||||
--color-surface: oklch(0.07 0 0);
|
||||
--color-ink: oklch(1 0 0);
|
||||
--color-ink-soft: oklch(0.72 0 0);
|
||||
--color-border: oklch(0.17 0 0);
|
||||
--color-accent: oklch(0.68 0.20 250);
|
||||
--shadow-card: 0 1px 4px oklch(1 0 0 / 0.06);
|
||||
}
|
||||
|
||||
/* === Blog typography === */
|
||||
|
||||
Reference in New Issue
Block a user