Skip to content

Commit 798b3d7

Browse files
author
LinuxJava7
committed
convert adwaita colours to oklch
1 parent 02a3f12 commit 798b3d7

File tree

1 file changed

+147
-147
lines changed

1 file changed

+147
-147
lines changed

adwaita.css

Lines changed: 147 additions & 147 deletions
Original file line numberDiff line numberDiff line change
@@ -1,218 +1,218 @@
11
:root {
22
/* Accent Colors */
3-
--accent-color: #1c71d8;
4-
--accent-bg-color: #3584e4;
5-
--accent-fg-color: #ffffff;
3+
--accent-color: oklch(0.56 0.18 256.43 / 1);
4+
--accent-bg-color: oklch(0.61 0.16 255.34 / 1);
5+
--accent-fg-color: oklch(1 0 0 / 1);
66

77
/* Destructive Colors */
8-
--destructive-color: #c01c28;
9-
--destructive-bg-color: #e01b24;
10-
--destructive-fg-color: #ffffff;
8+
--destructive-color: oklch(0.52 0.20 24.70 / 1);
9+
--destructive-bg-color: oklch(0.58 0.22 26.62 / 1);
10+
--destructive-fg-color: oklch(1 0 0 / 1);
1111

1212
/* Success Colors */
13-
--success-color: #1b8553;
14-
--success-bg-color: #2ec27e;
15-
--success-fg-color: #ffffff;
13+
--success-color: oklch(0.55 0.12 156.94 / 1);
14+
--success-bg-color: oklch(0.72 0.16 157.74 / 1);
15+
--success-fg-color: oklch(1 0 0 / 1);
1616

1717
/* Warning Colors */
18-
--warning-color: #9c6e03;
19-
--warning-bg-color: #e5a50a;
20-
--warning-fg-color: rgba(0, 0, 0, 0.8);
18+
--warning-color: oklch(0.57 0.12 79.38 / 1);
19+
--warning-bg-color: oklch(0.76 0.16 80.30 / 1);
20+
--warning-fg-color: oklch(0 0 0 / 0.80);
2121

2222
/* Error Colors */
23-
--error-color: #c01c28;
24-
--error-bg-color: #e01b24;
25-
--error-fg-color: #ffffff;
23+
--error-color: oklch(0.52 0.20 24.70 / 1);
24+
--error-bg-color: oklch(0.58 0.22 26.62 / 1);
25+
--error-fg-color: oklch(1 0 0 / 1);
2626

2727
/* Window Colors */
28-
--window-bg-color: #fafafa;
29-
--window-fg-color: rgba(0, 0, 0, 0.8);
28+
--window-bg-color: oklch(0.99 0 0 / 1);
29+
--window-fg-color: oklch(0 0 0 / 0.80);
3030

3131
/* View Colors */
32-
--view-bg-color: #ffffff;
33-
--view-fg-color: rgba(0, 0, 0, 0.8);
32+
--view-bg-color: oklch(1 0 0 / 1);
33+
--view-fg-color: oklch(0 0 0 / 0.80);
3434

3535
/* Header Bar Colors */
36-
--headerbar-bg-color: #ffffff;
37-
--headerbar-fg-color: rgba(0, 0, 0, 0.8);
38-
--headerbar-border-color: rgba(0, 0, 0, 0.8);
39-
--headerbar-backdrop-color: #fafafa;
40-
--headerbar-shade-color: rgba(0, 0, 0, 0.12);
41-
--headerbar-darker-shade-color: rgba(0, 0, 0, 0.12);
36+
--headerbar-bg-color: oklch(1 0 0 / 1);
37+
--headerbar-fg-color: oklch(0 0 0 / 0.80);
38+
--headerbar-border-color: oklch(0 0 0 / 0.80);
39+
--headerbar-backdrop-color: oklch(0.99 0 0 / 1);
40+
--headerbar-shade-color: oklch(0 0 0 / 0.12);
41+
--headerbar-darker-shade-color: oklch(0 0 0 / 0.12);
4242

4343
/* Sidebar Colors */
44-
--sidebar-bg-color: #ebebeb;
45-
--sidebar-fg-color: rgba(0, 0, 0, 0.8);
46-
--sidebar-backdrop-color: #f2f2f2;
47-
--sidebar-border-color: rgba(0, 0, 0, 0.07);
48-
--sidebar-shade-color: rgba(0, 0, 0, 0.07);
44+
--sidebar-bg-color: oklch(0.94 0 0 / 1);
45+
--sidebar-fg-color: oklch(0 0 0 / 0.80);
46+
--sidebar-backdrop-color: oklch(0.96 0 0 / 1);
47+
--sidebar-border-color: oklch(0 0 0 / 0.07);
48+
--sidebar-shade-color: oklch(0 0 0 / 0.07);
4949

5050
/* Secondary Sidebar Colors */
51-
--secondary-sidebar-bg-color: #f3f3f3;
52-
--secondary-sidebar-fg-color: rgba(0, 0, 0, 0.8);
53-
--secondary-sidebar-backdrop-color: #f6f6f6;
54-
--secondary-sidebar-border-color: rgba(0, 0, 0, 0.07);
55-
--secondary-sidebar-shade-color: rgba(0, 0, 0, 0.07);
51+
--secondary-sidebar-bg-color: oklch(0.96 0 0 / 1);
52+
--secondary-sidebar-fg-color: oklch(0 0 0 / 0.80);
53+
--secondary-sidebar-backdrop-color: oklch(0.97 0 0 / 1);
54+
--secondary-sidebar-border-color: oklch(0 0 0 / 0.07);
55+
--secondary-sidebar-shade-color: oklch(0 0 0 / 0.07);
5656

5757
/* Card Colors */
58-
--card-bg-color: #ffffff;
59-
--card-fg-color: rgba(0, 0, 0, 0.8);
60-
--card-shade-color: rgba(0, 0, 0, 0.07);
58+
--card-bg-color: oklch(1 0 0 / 1);
59+
--card-fg-color: oklch(0 0 0 / 0.80);
60+
--card-shade-color: oklch(0 0 0 / 0.07);
6161

6262
/* Thumbnail Colors */
63-
--thumbnail-bg-color: #ffffff;
64-
--thumbnail-fg-color: rgba(0, 0, 0, 0.8);
63+
--thumbnail-bg-color: oklch(1 0 0 / 1);
64+
--thumbnail-fg-color: oklch(0 0 0 / 0.80);
6565

6666
/* Dialog Colors */
67-
--dialog-bg-color: #fafafa;
68-
--dialog-fg-color: rgba(0, 0, 0, 0.8);
67+
--dialog-bg-color: oklch(0.99 0 0 / 1);
68+
--dialog-fg-color: oklch(0 0 0 / 0.80);
6969

7070
/* Popover Colors */
71-
--popover-bg-color: #ffffff;
72-
--popover-fg-color: rgba(0, 0, 0, 0.8);
73-
--popover-shade-color: rgba(0, 0, 0, 0.07);
71+
--popover-bg-color: oklch(1 0 0 / 1);
72+
--popover-fg-color: oklch(0 0 0 / 0.80);
73+
--popover-shade-color: oklch(0 0 0 / 0.07);
7474

7575
/* Miscellaneous Colors */
76-
--shade-color: rgba(0, 0, 0, 0.07);
77-
--scrollbar-outline-color: #ffffff;
76+
--shade-color: oklch(0 0 0 / 0.07);
77+
--scrollbar-outline-color: oklch(1 0 0 / 1);
7878

7979
/* Helper Colors */
8080
--borders: rgba(0, 0, 0, 0.15);
8181

8282
/* Palette Colors */
83-
--blue-1: #99c1f1;
84-
--blue-2: #62a0ea;
85-
--blue-3: #3584e4;
86-
--blue-4: #1c71d8;
87-
--blue-5: #1a5fb4;
88-
89-
--green-1: #8ff0a4;
90-
--green-2: #57e389;
91-
--green-3: #33d17a;
92-
--green-4: #2ec27e;
93-
--green-5: #26a269;
94-
95-
--yellow-1: #f9f06b;
96-
--yellow-2: #f8e45c;
97-
--yellow-3: #f6d32d;
98-
--yellow-4: #f5c211;
99-
--yellow-5: #e5a50a;
100-
101-
--orange-1: #ffbe6f;
102-
--orange-2: #ffa348;
103-
--orange-3: #ff7800;
104-
--orange-4: #e66100;
105-
--orange-5: #c64600;
106-
107-
--red-1: #f66151;
108-
--red-2: #ed333b;
109-
--red-3: #e01b24;
110-
--red-4: #c01c28;
111-
--red-5: #a51d2d;
112-
113-
--purple-1: #dc8add;
114-
--purple-2: #c061cb;
115-
--purple-3: #9141ac;
116-
--purple-4: #813d9c;
117-
--purple-5: #613583;
118-
119-
--brown-1: #cdab8f;
120-
--brown-2: #b5835a;
121-
--brown-3: #986a44;
122-
--brown-4: #865e3c;
123-
--brown-5: #63452c;
124-
125-
--light-1: #ffffff;
126-
--light-2: #f6f5f4;
127-
--light-3: #deddda;
128-
--light-4: #c0bfbc;
129-
--light-5: #9a9996;
130-
131-
--dark-1: #77767b;
132-
--dark-2: #5e5c64;
133-
--dark-3: #3d3846;
134-
--dark-4: #241f31;
135-
--dark-5: #000000;
83+
--blue-1: oklch(0.80 0.08 253.32 / 1);
84+
--blue-2: oklch(0.70 0.13 253.81 / 1);
85+
--blue-3: oklch(0.61 0.16 255.34 / 1);
86+
--blue-4: oklch(0.56 0.18 256.43 / 1);
87+
--blue-5: oklch(0.49 0.15 256.36 / 1);
88+
89+
--green-1: oklch(0.88 0.14 149.71 / 1);
90+
--green-2: oklch(0.82 0.18 152.10 / 1);
91+
--green-3: oklch(0.76 0.18 153.61 / 1);
92+
--green-4: oklch(0.72 0.16 157.74 / 1);
93+
--green-5: oklch(0.63 0.14 157.86 / 1);
94+
95+
--yellow-1: oklch(0.94 0.15 105.39 / 1);
96+
--yellow-2: oklch(0.91 0.15 100.93 / 1);
97+
--yellow-3: oklch(0.87 0.17 96.01 / 1);
98+
--yellow-4: oklch(0.84 0.17 89.13 / 1);
99+
--yellow-5: oklch(0.76 0.16 80.30 / 1);
100+
101+
--orange-1: oklch(0.85 0.12 70.28 / 1);
102+
--orange-2: oklch(0.79 0.15 61.99 / 1);
103+
--orange-3: oklch(0.72 0.19 49.76 / 1);
104+
--orange-4: oklch(0.65 0.18 45.56 / 1);
105+
--orange-5: oklch(0.57 0.17 40.75 / 1);
106+
107+
--red-1: oklch(0.68 0.19 28.95 / 1);
108+
--red-2: oklch(0.62 0.22 24.71 / 1);
109+
--red-3: oklch(0.58 0.22 26.62 / 1);
110+
--red-4: oklch(0.52 0.20 24.70 / 1);
111+
--red-5: oklch(0.47 0.17 21.40 / 1);
112+
113+
--purple-1: oklch(0.75 0.15 326.49 / 1);
114+
--purple-2: oklch(0.64 0.18 323.36 / 1);
115+
--purple-3: oklch(0.53 0.18 316.65 / 1);
116+
--purple-4: oklch(0.49 0.16 315.20 / 1);
117+
--purple-5: oklch(0.42 0.13 307.80 / 1);
118+
119+
--brown-1: oklch(0.76 0.06 61.31 / 1);
120+
--brown-2: oklch(0.65 0.08 59.94 / 1);
121+
--brown-3: oklch(0.56 0.08 59.75 / 1);
122+
--brown-4: oklch(0.52 0.07 60.61 / 1);
123+
--brown-5: oklch(0.42 0.06 60.20 / 1);
124+
125+
--light-1: oklch(1 0 0 / 1);
126+
--light-2: oklch(0.97 0 67.80 / 1);
127+
--light-3: oklch(0.90 0 91.45 / 1);
128+
--light-4: oklch(0.80 0 91.46 / 1);
129+
--light-5: oklch(0.68 0 91.47 / 1);
130+
131+
--dark-1: oklch(0.57 0.01 295.33 / 1);
132+
--dark-2: oklch(0.48 0.01 297.35 / 1);
133+
--dark-3: oklch(0.35 0.02 301.42 / 1);
134+
--dark-4: oklch(0.25 0.03 296.66 / 1);
135+
--dark-5: oklch(0 0 0 / 1);
136136
}
137137

138138
@media (prefers-color-scheme: dark) {
139139
:root {
140140
/* Accent Colors */
141-
--accent-color: #78aeed;
142-
--accent-bg-color: #3584e4;
143-
--accent-fg-color: #ffffff;
141+
--accent-color: oklch(0.74 0.11 252.99 / 1);
142+
--accent-bg-color: oklch(0.61 0.16 255.34 / 1);
143+
--accent-fg-color: oklch(1 0 0 / 1);
144144

145145
/* Destructive Colors */
146-
--destructive-color: #ff7b63;
147-
--destructive-bg-color: #c01c28;
148-
--destructive-fg-color: #ffffff;
146+
--destructive-color: oklch(0.73 0.17 31.89 / 1);
147+
--destructive-bg-color: oklch(0.52 0.20 24.70 / 1);
148+
--destructive-fg-color: oklch(1 0 0 / 1);
149149

150150
/* Success Colors */
151-
--success-color: #8ff0a4;
152-
--success-bg-color: #26a269;
153-
--success-fg-color: #ffffff;
151+
--success-color: oklch(0.88 0.14 149.71 / 1);
152+
--success-bg-color: oklch(0.63 0.14 157.86 / 1);
153+
--success-fg-color: oklch(1 0 0 / 1);
154154

155155
/* Warning Colors */
156-
--warning-color: #f8e45c;
157-
--warning-bg-color: #cd9309;
158-
--warning-fg-color: rgba(0, 0, 0, 0.8);
156+
--warning-color: oklch(0.91 0.15 100.93 / 1);
157+
--warning-bg-color: oklch(0.70 0.14 80.05 / 1);
158+
--warning-fg-color: oklch(0 0 0 / 0.80);
159159

160160
/* Error Colors */
161-
--error-color: #ff7b63;
162-
--error-bg-color: #c01c28;
163-
--error-fg-color: #ffffff;
161+
--error-color: oklch(0.73 0.17 31.89 / 1);
162+
--error-bg-color: oklch(0.52 0.20 24.70 / 1);
163+
--error-fg-color: oklch(1 0 0 / 1);
164164

165165
/* Window Colors */
166-
--window-bg-color: #242424;
167-
--window-fg-color: #ffffff;
166+
--window-bg-color: oklch(0.26 0 0 / 1);
167+
--window-fg-color: oklch(1 0 0 / 1);
168168

169169
/* View Colors */
170-
--view-bg-color: #1e1e1e;
171-
--view-fg-color: #ffffff;
170+
--view-bg-color: oklch(0.24 0 0 / 1);
171+
--view-fg-color: oklch(1 0 0 / 1);
172172

173173
/* Header Bar Colors */
174-
--headerbar-bg-color: #303030;
175-
--headerbar-fg-color: #ffffff;
176-
--headerbar-border-color: #ffffff;
177-
--headerbar-backdrop-color: #242424;
178-
--headerbar-shade-color: rgba(0, 0, 0, 0.36);
179-
--headerbar-darker-shade-color: rgba(0, 0, 0, 0.9);
174+
--headerbar-bg-color: oklch(0.31 0 0 / 1);
175+
--headerbar-fg-color: oklch(1 0 0 / 1);
176+
--headerbar-border-color: oklch(1 0 0 / 1);
177+
--headerbar-backdrop-color: oklch(0.26 0 0 / 1);
178+
--headerbar-shade-color: oklch(0 0 0 / 0.36);
179+
--headerbar-darker-shade-color: oklch(0 0 0 / 0.90);
180180

181181
/* Sidebar Colors */
182-
--sidebar-bg-color: #303030;
183-
--sidebar-fg-color: #ffffff;
184-
--sidebar-backdrop-color: #2a2a2a;
185-
--sidebar-border-color: rgba(0, 0, 0, 0.36);
186-
--sidebar-shade-color: rgba(0, 0, 0, 0.25);
182+
--sidebar-bg-color: oklch(0.31 0 0 / 1);
183+
--sidebar-fg-color: oklch(1 0 0 / 1);
184+
--sidebar-backdrop-color: oklch(0.29 0 0 / 1);
185+
--sidebar-border-color: oklch(0 0 0 / 0.36);
186+
--sidebar-shade-color: oklch(0 0 0 / 0.25);
187187

188188
/* Secondary Sidebar Colors */
189-
--secondary-sidebar-bg-color: #2a2a2a;
190-
--secondary-sidebar-fg-color: #ffffff;
191-
--secondary-sidebar-backdrop-color: #272727;
192-
--secondary-sidebar-border-color: rgba(0, 0, 0, 0.36);
193-
--secondary-sidebar-shade-color: rgba(0, 0, 0, 0.25);
189+
--secondary-sidebar-bg-color: oklch(0.29 0 0 / 1);
190+
--secondary-sidebar-fg-color: oklch(1 0 0 / 1);
191+
--secondary-sidebar-backdrop-color: oklch(0.27 0 0 / 1);
192+
--secondary-sidebar-border-color: oklch(0 0 0 / 0.36);
193+
--secondary-sidebar-shade-color: oklch(0 0 0 / 0.25);
194194

195195
/* Card Colors */
196-
--card-bg-color: rgba(255, 255, 255, 0.08);
197-
--card-fg-color: #ffffff;
198-
--card-shade-color: rgba(0, 0, 0, 0.36);
196+
--card-bg-color: oklch(1 0 0 / 0.08);
197+
--card-fg-color: oklch(1 0 0 / 1);
198+
--card-shade-color: oklch(0 0 0 / 0.36);
199199

200200
/* Thumbnail Colors */
201-
--thumbnail-bg-color: #383838;
202-
--thumbnail-fg-color: #ffffff;
201+
--thumbnail-bg-color: oklch(0.34 0 0 / 1);
202+
--thumbnail-fg-color: oklch(1 0 0 / 1);
203203

204204
/* Dialog Colors */
205-
--dialog-bg-color: #383838;
206-
--dialog-fg-color: #ffffff;
205+
--dialog-bg-color: oklch(0.34 0 0 / 1);
206+
--dialog-fg-color: oklch(1 0 0 / 1);
207207

208208
/*tPopover Colors */
209-
--popover-bg-color: #383838;
210-
--popover-fg-color: #ffffff;
211-
--popover-shade-color: rgba(0, 0, 0, 0.25);
209+
--popover-bg-color: oklch(0.34 0 0 / 1);
210+
--popover-fg-color: oklch(1 0 0 / 1);
211+
--popover-shade-color: oklch(0 0 0 / 0.25);
212212

213213
/* Miscellaneous Colors */
214-
--shade-color: rgba(0, 0, 0, 0.25);
215-
--scrollbar-outline-color: rgba(0, 0, 0, 0.5);
214+
--shade-color: oklch(0 0 0 / 0.25);
215+
--scrollbar-outline-color: oklch(0 0 0 / 0.50);
216216

217217
/* Helper Colors */
218218
--borders: rgba(255, 255, 255, 0.5);

0 commit comments

Comments
 (0)