Fantasy 24

1
:root {
2
  --background: var(--color-fantasy-24-neutral-50);
3
  --foreground: var(--color-fantasy-24-neutral-950);
4
  --card: var(--color-fantasy-24-neutral-50);
5
  --card-foreground: var(--color-fantasy-24-neutral-950);
6
  --popover: var(--color-fantasy-24-neutral-50);
7
  --popover-foreground: var(--color-fantasy-24-neutral-950);
8
  --muted: var(--color-fantasy-24-neutral-50);
9
  --muted-foreground: var(--color-fantasy-24-neutral-400);
10
  --accent: var(--color-fantasy-24-neutral-50);
11
  --accent-foreground: var(--color-fantasy-24-neutral-600);
12
  --border: var(--color-fantasy-24-neutral-400);
13
  --input: var(--color-fantasy-24-neutral-400);
14
  --ring: var(--color-fantasy-24-neutral-600);
15
  --primary: var(--color-fantasy-24-blue-50);
16
  --primary-foreground: var(--color-fantasy-24-blue-600);
17
  --info: var(--color-fantasy-24-brown-50);
18
  --info-foreground: var(--color-fantasy-24-brown-600);
19
  --success: var(--color-fantasy-24-green-50);
20
  --success-foreground: var(--color-fantasy-24-green-600);
21
  --warning: var(--color-fantasy-24-amber-50);
22
  --warning-foreground: var(--color-fantasy-24-amber-600);
23
  --danger: var(--color-fantasy-24-red-50);
24
  --danger-foreground: var(--color-fantasy-24-red-600);
25
}
26
.dark,
27
[data-theme="dark"] {
28
  --background: var(--color-fantasy-24-neutral-950);
29
  --foreground: var(--color-fantasy-24-neutral-400);
30
  --card: var(--color-fantasy-24-neutral-950);
31
  --card-foreground: var(--color-fantasy-24-neutral-400);
32
  --popover: var(--color-fantasy-24-neutral-950);
33
  --popover-foreground: var(--color-fantasy-24-neutral-400);
34
  --muted: var(--color-fantasy-24-neutral-950);
35
  --muted-foreground: var(--color-fantasy-24-neutral-600);
36
  --accent: var(--color-fantasy-24-neutral-950);
37
  --accent-foreground: var(--color-fantasy-24-neutral-50);
38
  --border: var(--color-fantasy-24-neutral-600);
39
  --input: var(--color-fantasy-24-neutral-600);
40
  --ring: var(--color-fantasy-24-neutral-50);
41
  --primary: var(--color-fantasy-24-blue-600);
42
  --primary-foreground: var(--color-fantasy-24-blue-50);
43
  --info: var(--color-fantasy-24-brown-600);
44
  --info-foreground: var(--color-fantasy-24-brown-50);
45
  --success: var(--color-fantasy-24-green-400);
46
  --success-foreground: var(--color-fantasy-24-green-50);
47
  --warning: var(--color-fantasy-24-amber-600);
48
  --warning-foreground: var(--color-fantasy-24-amber-50);
49
  --danger: var(--color-fantasy-24-red-600);
50
  --danger-foreground: var(--color-fantasy-24-red-50);
51
}