WorkRoot/Astro-Component
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated New color Schene

Browse Source
This commit is contained in:
Clintchiz
2025-08-19 15:10:33 +05:30
parent 6b8672e1eb
commit 5fbfc2e54b
2 changed files with 18 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/style.css
+15 -16
View File
@@ -26,7 +26,7 @@
--card-foreground: 222 47% 11%;
--popover: 0 0% 100%;
--popover-foreground: 222 47% 11%;
--muted: 220 14% 96%;
--muted: 220 14% 96%;
--muted-foreground: 215 16% 46%;
--border: 214 31% 91%;
--input: 214 31% 91%;
@@ -434,28 +434,27 @@
}
/* Light: base from primary, then darken toward black */
:root {
[data-color]:not(.dark [data-color]) {
--bg-tint: 4%;
/* make the actual background derived from primary */
--background-default: color-mix(in hsl, hsl(var(--primary)) var(--bg-tint), white);
--background: var(--background-default);
--background-50: color-mix(in hsl, var(--background-default) 99%, black 1%);
--background-100: color-mix(in hsl, var(--background-default) 97%, black 3%);
--background-200: color-mix(in hsl, var(--background-default) 94%, black 6%);
--background-300: color-mix(in hsl, var(--background-default) 88%, black 12%);
--background-400: color-mix(in hsl, var(--background-default) 80%, black 20%);
--background-500: color-mix(in hsl, var(--background-default) 72%, black 28%);
--background-600: color-mix(in hsl, var(--background-default) 60%, black 40%);
--background-700: color-mix(in hsl, var(--background-default) 48%, black 52%);
--background-800: color-mix(in hsl, var(--background-default) 36%, black 64%);
--background-900: color-mix(in hsl, var(--background-default) 24%, black 76%);
--background-50: color-mix(in hsl, var(--background-default) 99%, black 1%);
--background-100: color-mix(in hsl, var(--background-default) 97%, black 3%);
--background-200: color-mix(in hsl, var(--background-default) 94%, black 6%);
--background-300: color-mix(in hsl, var(--background-default) 88%, black 12%);
--background-400: color-mix(in hsl, var(--background-default) 80%, black 20%);
--background-500: color-mix(in hsl, var(--background-default) 72%, black 28%);
--background-600: color-mix(in hsl, var(--background-default) 60%, black 40%);
--background-700: color-mix(in hsl, var(--background-default) 48%, black 52%);
--background-800: color-mix(in hsl, var(--background-default) 36%, black 64%);
--background-900: color-mix(in hsl, var(--background-default) 24%, black 76%);
}
/* Dark: base from primary as well (tint toward black), then lighten toward white */
:root.dark {
.dark [data-color],
:root.dark [data-color] {
--background-default: color-mix(in hsl, hsl(var(--primary)) var(--bg-tint), black);
--background: var(--background-default);
--background: var(--background-default);
--background-50: color-mix(in hsl, var(--background-default) 24%, white 76%);
--background-100: color-mix(in hsl, var(--background-default) 36%, white 64%);