Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions colors.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "style-forge.colors",
"version": "2025.1.18",
"version": "2025.1.22",
"description": "Style-Forge.Colors: customizable color palettes for consistent, visually appealing web designs.",
"type": "module",
"main": "colors.css",
Expand Down
50 changes: 25 additions & 25 deletions src/colors/10/aliceblue.css
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
:root {
[class*='aliceblue'] {
--sf-c-aliceblue: 208 100% 97%;
--sf-c-aliceblue-0: 208 100% 0%;
--sf-c-aliceblue-10: 208 100% 10%;
Expand Down Expand Up @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-aliceblue\:100\:dark, html.dark .sf-c-txt-
html.var[data-theme='auto'] .sf-c-aliceblue\:90\:dark, html.var.auto .sf-c-aliceblue\:90\:dark { color: hsl(208, 100%, 90%); background: hsl(208, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-aliceblue\:100\:dark, html.var.auto .sf-c-aliceblue\:100\:dark { color: hsl(208, 100%, 90%); background: hsl(208, 100%, 0%) }

html.var[data-theme='auto'] .sf-c-txt-aliceblue, html.auto .sf-c-txt-aliceblue { color: hsl(208, 100%, 97%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0, html.auto .sf-c-txt-aliceblue\:0 { color: hsl(208, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10, html.auto .sf-c-txt-aliceblue\:10 { color: hsl(208, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20, html.auto .sf-c-txt-aliceblue\:20 { color: hsl(208, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30, html.auto .sf-c-txt-aliceblue\:30 { color: hsl(208, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40, html.auto .sf-c-txt-aliceblue\:40 { color: hsl(208, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50, html.auto .sf-c-txt-aliceblue\:50 { color: hsl(208, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60, html.auto .sf-c-txt-aliceblue\:60 { color: hsl(208, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70, html.auto .sf-c-txt-aliceblue\:70 { color: hsl(208, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80, html.auto .sf-c-txt-aliceblue\:80 { color: hsl(208, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90, html.auto .sf-c-txt-aliceblue\:90 { color: hsl(208, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100, html.auto .sf-c-txt-aliceblue\:100 { color: hsl(208, 100%, 100%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue, html.var.auto .sf-c-txt-aliceblue { color: hsl(208, 100%, 97%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0, html.var.auto .sf-c-txt-aliceblue\:0 { color: hsl(208, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10, html.var.auto .sf-c-txt-aliceblue\:10 { color: hsl(208, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20, html.var.auto .sf-c-txt-aliceblue\:20 { color: hsl(208, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30, html.var.auto .sf-c-txt-aliceblue\:30 { color: hsl(208, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40, html.var.auto .sf-c-txt-aliceblue\:40 { color: hsl(208, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50, html.var.auto .sf-c-txt-aliceblue\:50 { color: hsl(208, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60, html.var.auto .sf-c-txt-aliceblue\:60 { color: hsl(208, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70, html.var.auto .sf-c-txt-aliceblue\:70 { color: hsl(208, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80, html.var.auto .sf-c-txt-aliceblue\:80 { color: hsl(208, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90, html.var.auto .sf-c-txt-aliceblue\:90 { color: hsl(208, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100, html.var.auto .sf-c-txt-aliceblue\:100 { color: hsl(208, 100%, 100%) }

html.var[data-theme='auto'] .sf-c-txt-aliceblue\:dark, html.auto .sf-c-txt-aliceblue\:dark { color: hsl(208, 100%, 97%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0\:dark, html.auto .sf-c-txt-aliceblue\:0\:dark { color: hsl(208, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10\:dark, html.auto .sf-c-txt-aliceblue\:10\:dark { color: hsl(208, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20\:dark, html.auto .sf-c-txt-aliceblue\:20\:dark { color: hsl(208, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30\:dark, html.auto .sf-c-txt-aliceblue\:30\:dark { color: hsl(208, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40\:dark, html.auto .sf-c-txt-aliceblue\:40\:dark { color: hsl(208, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50\:dark, html.auto .sf-c-txt-aliceblue\:50\:dark { color: hsl(208, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60\:dark, html.auto .sf-c-txt-aliceblue\:60\:dark { color: hsl(208, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70\:dark, html.auto .sf-c-txt-aliceblue\:70\:dark { color: hsl(208, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80\:dark, html.auto .sf-c-txt-aliceblue\:80\:dark { color: hsl(208, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90\:dark, html.auto .sf-c-txt-aliceblue\:90\:dark { color: hsl(208, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100\:dark, html.auto .sf-c-txt-aliceblue\:100\:dark { color: hsl(208, 100%, 100%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:dark, html.var.auto .sf-c-txt-aliceblue\:dark { color: hsl(208, 100%, 97%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:0\:dark, html.var.auto .sf-c-txt-aliceblue\:0\:dark { color: hsl(208, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:10\:dark, html.var.auto .sf-c-txt-aliceblue\:10\:dark { color: hsl(208, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:20\:dark, html.var.auto .sf-c-txt-aliceblue\:20\:dark { color: hsl(208, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:30\:dark, html.var.auto .sf-c-txt-aliceblue\:30\:dark { color: hsl(208, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:40\:dark, html.var.auto .sf-c-txt-aliceblue\:40\:dark { color: hsl(208, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:50\:dark, html.var.auto .sf-c-txt-aliceblue\:50\:dark { color: hsl(208, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:60\:dark, html.var.auto .sf-c-txt-aliceblue\:60\:dark { color: hsl(208, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:70\:dark, html.var.auto .sf-c-txt-aliceblue\:70\:dark { color: hsl(208, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:80\:dark, html.var.auto .sf-c-txt-aliceblue\:80\:dark { color: hsl(208, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:90\:dark, html.var.auto .sf-c-txt-aliceblue\:90\:dark { color: hsl(208, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aliceblue\:100\:dark, html.var.auto .sf-c-txt-aliceblue\:100\:dark { color: hsl(208, 100%, 100%) }
}
50 changes: 25 additions & 25 deletions src/colors/10/antiquewhite.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

50 changes: 25 additions & 25 deletions src/colors/10/aqua.css
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
:root {
[class*='aqua'] {
--sf-c-aqua: 180 100% 50%;
--sf-c-aqua-0: 180 100% 0%;
--sf-c-aqua-10: 180 100% 10%;
Expand Down Expand Up @@ -287,29 +287,29 @@ html.var[data-theme='dark'] .sf-c-txt-aqua\:100\:dark, html.dark .sf-c-txt-aqua\
html.var[data-theme='auto'] .sf-c-aqua\:90\:dark, html.var.auto .sf-c-aqua\:90\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-aqua\:100\:dark, html.var.auto .sf-c-aqua\:100\:dark { color: hsl(180, 100%, 90%); background: hsl(180, 100%, 0%) }

html.var[data-theme='auto'] .sf-c-txt-aqua, html.auto .sf-c-txt-aqua { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:0, html.auto .sf-c-txt-aqua\:0 { color: hsl(180, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:10, html.auto .sf-c-txt-aqua\:10 { color: hsl(180, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:20, html.auto .sf-c-txt-aqua\:20 { color: hsl(180, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:30, html.auto .sf-c-txt-aqua\:30 { color: hsl(180, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:40, html.auto .sf-c-txt-aqua\:40 { color: hsl(180, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:50, html.auto .sf-c-txt-aqua\:50 { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:60, html.auto .sf-c-txt-aqua\:60 { color: hsl(180, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:70, html.auto .sf-c-txt-aqua\:70 { color: hsl(180, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:80, html.auto .sf-c-txt-aqua\:80 { color: hsl(180, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:90, html.auto .sf-c-txt-aqua\:90 { color: hsl(180, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:100, html.auto .sf-c-txt-aqua\:100 { color: hsl(180, 100%, 100%) }
html.var[data-theme='auto'] .sf-c-txt-aqua, html.var.auto .sf-c-txt-aqua { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:0, html.var.auto .sf-c-txt-aqua\:0 { color: hsl(180, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:10, html.var.auto .sf-c-txt-aqua\:10 { color: hsl(180, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:20, html.var.auto .sf-c-txt-aqua\:20 { color: hsl(180, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:30, html.var.auto .sf-c-txt-aqua\:30 { color: hsl(180, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:40, html.var.auto .sf-c-txt-aqua\:40 { color: hsl(180, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:50, html.var.auto .sf-c-txt-aqua\:50 { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:60, html.var.auto .sf-c-txt-aqua\:60 { color: hsl(180, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:70, html.var.auto .sf-c-txt-aqua\:70 { color: hsl(180, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:80, html.var.auto .sf-c-txt-aqua\:80 { color: hsl(180, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:90, html.var.auto .sf-c-txt-aqua\:90 { color: hsl(180, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:100, html.var.auto .sf-c-txt-aqua\:100 { color: hsl(180, 100%, 100%) }

html.var[data-theme='auto'] .sf-c-txt-aqua\:dark, html.auto .sf-c-txt-aqua\:dark { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark, html.auto .sf-c-txt-aqua\:0\:dark { color: hsl(180, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark, html.auto .sf-c-txt-aqua\:10\:dark { color: hsl(180, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark, html.auto .sf-c-txt-aqua\:20\:dark { color: hsl(180, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark, html.auto .sf-c-txt-aqua\:30\:dark { color: hsl(180, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark, html.auto .sf-c-txt-aqua\:40\:dark { color: hsl(180, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark, html.auto .sf-c-txt-aqua\:50\:dark { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark, html.auto .sf-c-txt-aqua\:60\:dark { color: hsl(180, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark, html.auto .sf-c-txt-aqua\:70\:dark { color: hsl(180, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark, html.auto .sf-c-txt-aqua\:80\:dark { color: hsl(180, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark, html.auto .sf-c-txt-aqua\:90\:dark { color: hsl(180, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark, html.auto .sf-c-txt-aqua\:100\:dark { color: hsl(180, 100%, 100%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:dark, html.var.auto .sf-c-txt-aqua\:dark { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:0\:dark, html.var.auto .sf-c-txt-aqua\:0\:dark { color: hsl(180, 100%, 0%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:10\:dark, html.var.auto .sf-c-txt-aqua\:10\:dark { color: hsl(180, 100%, 10%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:20\:dark, html.var.auto .sf-c-txt-aqua\:20\:dark { color: hsl(180, 100%, 20%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:30\:dark, html.var.auto .sf-c-txt-aqua\:30\:dark { color: hsl(180, 100%, 30%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:40\:dark, html.var.auto .sf-c-txt-aqua\:40\:dark { color: hsl(180, 100%, 40%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:50\:dark, html.var.auto .sf-c-txt-aqua\:50\:dark { color: hsl(180, 100%, 50%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:60\:dark, html.var.auto .sf-c-txt-aqua\:60\:dark { color: hsl(180, 100%, 60%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:70\:dark, html.var.auto .sf-c-txt-aqua\:70\:dark { color: hsl(180, 100%, 70%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:80\:dark, html.var.auto .sf-c-txt-aqua\:80\:dark { color: hsl(180, 100%, 80%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:90\:dark, html.var.auto .sf-c-txt-aqua\:90\:dark { color: hsl(180, 100%, 90%) }
html.var[data-theme='auto'] .sf-c-txt-aqua\:100\:dark, html.var.auto .sf-c-txt-aqua\:100\:dark { color: hsl(180, 100%, 100%) }
}
Loading
Loading