hozen: add new color system
This commit is contained in:
parent
723bf4d367
commit
11bd9a3671
6 changed files with 332 additions and 373 deletions
|
|
@ -2,6 +2,7 @@
|
||||||
imports = [
|
imports = [
|
||||||
./apps.nix
|
./apps.nix
|
||||||
./lib
|
./lib
|
||||||
|
./hozen
|
||||||
./hosts
|
./hosts
|
||||||
./keys.nix
|
./keys.nix
|
||||||
./pkgs
|
./pkgs
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,81 @@
|
||||||
{ook, ...}: let
|
{ook, ...}: let
|
||||||
|
inherit (ook.lib.color.utils) mkLightColorScheme mkDarkColorScheme;
|
||||||
|
|
||||||
|
darkScheme = mkDarkColorScheme {
|
||||||
|
neutrals = {
|
||||||
|
"50" = "dfd2b3";
|
||||||
|
"100" = "d9c7a5";
|
||||||
|
"150" = "d4be98";
|
||||||
|
"200" = "c6b395";
|
||||||
|
"250" = "b4a288";
|
||||||
|
"300" = "a49384";
|
||||||
|
"350" = "99897a";
|
||||||
|
"400" = "8b7c6f";
|
||||||
|
"450" = "7d6f64";
|
||||||
|
"500" = "716860";
|
||||||
|
"550" = "645f59";
|
||||||
|
"600" = "585350";
|
||||||
|
"650" = "4d4947";
|
||||||
|
"700" = "3f3b3b";
|
||||||
|
"750" = "343232";
|
||||||
|
"800" = "282828";
|
||||||
|
"850" = "212121";
|
||||||
|
"900" = "1a1a1a";
|
||||||
|
};
|
||||||
|
primary = "ea6962";
|
||||||
|
red = "ea6962";
|
||||||
|
orange = "e78a4e";
|
||||||
|
yellow = "d8a657";
|
||||||
|
olive = "b9b25f";
|
||||||
|
green = "a9b665";
|
||||||
|
teal = "89b482";
|
||||||
|
blue = "7daea3";
|
||||||
|
violet = "d892c1";
|
||||||
|
purple = "d3869b";
|
||||||
|
pink = "cf91be";
|
||||||
|
brown = "a87757";
|
||||||
|
};
|
||||||
|
|
||||||
|
lightScheme = mkLightColorScheme {
|
||||||
|
neutrals = {
|
||||||
|
"50" = "f7efda";
|
||||||
|
"100" = "f4eac8";
|
||||||
|
"150" = "f2e5bc";
|
||||||
|
"200" = "e7d9b1";
|
||||||
|
"250" = "ddcca6";
|
||||||
|
"300" = "d3c19c";
|
||||||
|
"350" = "c5b496";
|
||||||
|
"400" = "b7a78f";
|
||||||
|
"450" = "a89984";
|
||||||
|
"500" = "a08e79";
|
||||||
|
"550" = "9a826a";
|
||||||
|
"600" = "91785f";
|
||||||
|
"650" = "8a7056";
|
||||||
|
"700" = "745a44";
|
||||||
|
"750" = "6d4e3c";
|
||||||
|
"800" = "654735";
|
||||||
|
"850" = "5e4131";
|
||||||
|
"900" = "51372a";
|
||||||
|
};
|
||||||
|
primary = "45707a";
|
||||||
|
red = "be4141"; # contrast 4.55
|
||||||
|
orange = "ad540b"; # contrast 4.52
|
||||||
|
yellow = "966208"; # contrast 4.51
|
||||||
|
olive = "707029"; # contrast 4.51
|
||||||
|
green = "67732b"; # contrast 4.51
|
||||||
|
teal = "497459"; # contrast 4.67
|
||||||
|
blue = "45707a"; # contrast 4.75
|
||||||
|
violet = "7d6198"; # contrast 4.54
|
||||||
|
purple = "8f5b7c"; # contrast 4.63
|
||||||
|
pink = "925d66"; # contrast 4.6
|
||||||
|
brown = "654735"; # contrast 7.31
|
||||||
|
};
|
||||||
style = {
|
style = {
|
||||||
color = import ./dark.nix {inherit ook;};
|
color = darkScheme;
|
||||||
light.color = import ./light.nix {inherit ook;};
|
light.color = lightScheme;
|
||||||
dark.color = import ./dark.nix {inherit ook;};
|
dark.color = darkScheme;
|
||||||
};
|
};
|
||||||
in {
|
in {
|
||||||
_module.args.sytle = style;
|
_module.args.hozen = style;
|
||||||
flake.style = style;
|
flake.hozen = style;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,310 +0,0 @@
|
||||||
# Color Scheme Documentation
|
|
||||||
|
|
||||||
Generated on: 1730946863
|
|
||||||
|
|
||||||
## Table of Contents
|
|
||||||
|
|
||||||
- [Neutral Shades](#neutral-shades)
|
|
||||||
- [Base Colors](#base-colors)
|
|
||||||
- [Syntax Highlighting](#syntax-highlighting)
|
|
||||||
- [Semantic Colors](#semantic-colors)
|
|
||||||
- [Color Scales](#color-scales)
|
|
||||||
|
|
||||||
## Color Preview
|
|
||||||
|
|
||||||
### Neutral Shades
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `100` | <span style='display:inline-block; width:50px; height:20px; background:#d9c7a5; border:1px solid #282828;'></span> | `#d9c7a5` |
|
|
||||||
| `150` | <span style='display:inline-block; width:50px; height:20px; background:#d4be98; border:1px solid #282828;'></span> | `#d4be98` |
|
|
||||||
| `200` | <span style='display:inline-block; width:50px; height:20px; background:#c6b395; border:1px solid #282828;'></span> | `#c6b395` |
|
|
||||||
| `250` | <span style='display:inline-block; width:50px; height:20px; background:#b4a288; border:1px solid #282828;'></span> | `#b4a288` |
|
|
||||||
| `300` | <span style='display:inline-block; width:50px; height:20px; background:#a49384; border:1px solid #282828;'></span> | `#a49384` |
|
|
||||||
| `350` | <span style='display:inline-block; width:50px; height:20px; background:#99897a; border:1px solid #282828;'></span> | `#99897a` |
|
|
||||||
| `400` | <span style='display:inline-block; width:50px; height:20px; background:#8b7c6f; border:1px solid #282828;'></span> | `#8b7c6f` |
|
|
||||||
| `450` | <span style='display:inline-block; width:50px; height:20px; background:#7d6f64; border:1px solid #282828;'></span> | `#7d6f64` |
|
|
||||||
| `50` | <span style='display:inline-block; width:50px; height:20px; background:#dfd2b3; border:1px solid #282828;'></span> | `#dfd2b3` |
|
|
||||||
| `500` | <span style='display:inline-block; width:50px; height:20px; background:#716860; border:1px solid #282828;'></span> | `#716860` |
|
|
||||||
| `550` | <span style='display:inline-block; width:50px; height:20px; background:#645f59; border:1px solid #282828;'></span> | `#645f59` |
|
|
||||||
| `600` | <span style='display:inline-block; width:50px; height:20px; background:#585350; border:1px solid #282828;'></span> | `#585350` |
|
|
||||||
| `650` | <span style='display:inline-block; width:50px; height:20px; background:#4d4947; border:1px solid #282828;'></span> | `#4d4947` |
|
|
||||||
| `700` | <span style='display:inline-block; width:50px; height:20px; background:#3f3b3b; border:1px solid #282828;'></span> | `#3f3b3b` |
|
|
||||||
| `750` | <span style='display:inline-block; width:50px; height:20px; background:#343232; border:1px solid #282828;'></span> | `#343232` |
|
|
||||||
| `800` | <span style='display:inline-block; width:50px; height:20px; background:#282828; border:1px solid #555;'></span> | `#282828` |
|
|
||||||
| `850` | <span style='display:inline-block; width:50px; height:20px; background:#212121; border:1px solid #282828;'></span> | `#212121` |
|
|
||||||
| `900` | <span style='display:inline-block; width:50px; height:20px; background:#1a1a1a; border:1px solid #282828;'></span> | `#1a1a1a` |
|
|
||||||
|
|
||||||
### Base Colors
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base00` | <span style='display:inline-block; width:50px; height:20px; background:#282828; border:1px solid #555;'></span> | `#282828` |
|
|
||||||
| `base01` | <span style='display:inline-block; width:50px; height:20px; background:#3f3b3b; border:1px solid #282828;'></span> | `#3f3b3b` |
|
|
||||||
| `base02` | <span style='display:inline-block; width:50px; height:20px; background:#585350; border:1px solid #282828;'></span> | `#585350` |
|
|
||||||
| `base03` | <span style='display:inline-block; width:50px; height:20px; background:#7d6f64; border:1px solid #282828;'></span> | `#7d6f64` |
|
|
||||||
| `base04` | <span style='display:inline-block; width:50px; height:20px; background:#a49384; border:1px solid #282828;'></span> | `#a49384` |
|
|
||||||
| `base05` | <span style='display:inline-block; width:50px; height:20px; background:#d4be98; border:1px solid #282828;'></span> | `#d4be98` |
|
|
||||||
| `base06` | <span style='display:inline-block; width:50px; height:20px; background:#d9c7a5; border:1px solid #282828;'></span> | `#d9c7a5` |
|
|
||||||
| `base07` | <span style='display:inline-block; width:50px; height:20px; background:#dfd2b3; border:1px solid #282828;'></span> | `#dfd2b3` |
|
|
||||||
| `base08` | <span style='display:inline-block; width:50px; height:20px; background:#ea6962; border:1px solid #282828;'></span> | `#ea6962` |
|
|
||||||
| `base09` | <span style='display:inline-block; width:50px; height:20px; background:#e78a4e; border:1px solid #282828;'></span> | `#e78a4e` |
|
|
||||||
| `base0A` | <span style='display:inline-block; width:50px; height:20px; background:#d8a657; border:1px solid #282828;'></span> | `#d8a657` |
|
|
||||||
| `base0B` | <span style='display:inline-block; width:50px; height:20px; background:#a9b665; border:1px solid #282828;'></span> | `#a9b665` |
|
|
||||||
| `base0C` | <span style='display:inline-block; width:50px; height:20px; background:#89b482; border:1px solid #282828;'></span> | `#89b482` |
|
|
||||||
| `base0D` | <span style='display:inline-block; width:50px; height:20px; background:#7daea3; border:1px solid #282828;'></span> | `#7daea3` |
|
|
||||||
| `base0E` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `base0F` | <span style='display:inline-block; width:50px; height:20px; background:#a87757; border:1px solid #282828;'></span> | `#a87757` |
|
|
||||||
| `base10` | <span style='display:inline-block; width:50px; height:20px; background:#212121; border:1px solid #282828;'></span> | `#212121` |
|
|
||||||
| `base11` | <span style='display:inline-block; width:50px; height:20px; background:#1a1a1a; border:1px solid #282828;'></span> | `#1a1a1a` |
|
|
||||||
| `base12` | <span style='display:inline-block; width:50px; height:20px; background:#e58b86; border:1px solid #282828;'></span> | `#e58b86` |
|
|
||||||
| `base13` | <span style='display:inline-block; width:50px; height:20px; background:#d3b17b; border:1px solid #282828;'></span> | `#d3b17b` |
|
|
||||||
| `base14` | <span style='display:inline-block; width:50px; height:20px; background:#adb486; border:1px solid #282828;'></span> | `#adb486` |
|
|
||||||
| `base15` | <span style='display:inline-block; width:50px; height:20px; background:#a2b59f; border:1px solid #282828;'></span> | `#a2b59f` |
|
|
||||||
| `base16` | <span style='display:inline-block; width:50px; height:20px; background:#9bafaa; border:1px solid #282828;'></span> | `#9bafaa` |
|
|
||||||
| `base17` | <span style='display:inline-block; width:50px; height:20px; background:#d3a4b1; border:1px solid #282828;'></span> | `#d3a4b1` |
|
|
||||||
|
|
||||||
### Syntax Highlighting
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `boolean` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `comment` | <span style='display:inline-block; width:50px; height:20px; background:#a49384; border:1px solid #282828;'></span> | `#a49384` |
|
|
||||||
| `constant` | <span style='display:inline-block; width:50px; height:20px; background:#89b482; border:1px solid #282828;'></span> | `#89b482` |
|
|
||||||
| `define` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `exception` | <span style='display:inline-block; width:50px; height:20px; background:#ea6962; border:1px solid #282828;'></span> | `#ea6962` |
|
|
||||||
| `float` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `function` | <span style='display:inline-block; width:50px; height:20px; background:#a9b665; border:1px solid #282828;'></span> | `#a9b665` |
|
|
||||||
| `identifier` | <span style='display:inline-block; width:50px; height:20px; background:#7daea3; border:1px solid #282828;'></span> | `#7daea3` |
|
|
||||||
| `include` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `label` | <span style='display:inline-block; width:50px; height:20px; background:#e78a4e; border:1px solid #282828;'></span> | `#e78a4e` |
|
|
||||||
| `macro` | <span style='display:inline-block; width:50px; height:20px; background:#89b482; border:1px solid #282828;'></span> | `#89b482` |
|
|
||||||
| `number` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `operator` | <span style='display:inline-block; width:50px; height:20px; background:#e78a4e; border:1px solid #282828;'></span> | `#e78a4e` |
|
|
||||||
| `preCondit` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `preproc` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `special` | <span style='display:inline-block; width:50px; height:20px; background:#d8a657; border:1px solid #282828;'></span> | `#d8a657` |
|
|
||||||
| `specialChar` | <span style='display:inline-block; width:50px; height:20px; background:#d8a657; border:1px solid #282828;'></span> | `#d8a657` |
|
|
||||||
| `statement` | <span style='display:inline-block; width:50px; height:20px; background:#ea6962; border:1px solid #282828;'></span> | `#ea6962` |
|
|
||||||
| `storageClass` | <span style='display:inline-block; width:50px; height:20px; background:#e78a4e; border:1px solid #282828;'></span> | `#e78a4e` |
|
|
||||||
| `string` | <span style='display:inline-block; width:50px; height:20px; background:#a9b665; border:1px solid #282828;'></span> | `#a9b665` |
|
|
||||||
| `structure` | <span style='display:inline-block; width:50px; height:20px; background:#e78a4e; border:1px solid #282828;'></span> | `#e78a4e` |
|
|
||||||
| `tag` | <span style='display:inline-block; width:50px; height:20px; background:#89b482; border:1px solid #282828;'></span> | `#89b482` |
|
|
||||||
| `todo` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `type` | <span style='display:inline-block; width:50px; height:20px; background:#d8a657; border:1px solid #282828;'></span> | `#d8a657` |
|
|
||||||
|
|
||||||
### Semantic Colors
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `body` | <span style='display:inline-block; width:50px; height:20px; background:#3f3b3b; border:1px solid #282828;'></span> | `#3f3b3b` |
|
|
||||||
| `border` | <span style='display:inline-block; width:50px; height:20px; background:#d4be98; border:1px solid #282828;'></span> | `#d4be98` |
|
|
||||||
| `border-active` | <span style='display:inline-block; width:50px; height:20px; background:#d4be98; border:1px solid #282828;'></span> | `#d4be98` |
|
|
||||||
| `border-inactive` | <span style='display:inline-block; width:50px; height:20px; background:#585350; border:1px solid #282828;'></span> | `#585350` |
|
|
||||||
| `footer` | <span style='display:inline-block; width:50px; height:20px; background:#282828; border:1px solid #555;'></span> | `#282828` |
|
|
||||||
| `header` | <span style='display:inline-block; width:50px; height:20px; background:#282828; border:1px solid #555;'></span> | `#282828` |
|
|
||||||
| `menu` | <span style='display:inline-block; width:50px; height:20px; background:#282828; border:1px solid #555;'></span> | `#282828` |
|
|
||||||
| `subtext` | <span style='display:inline-block; width:50px; height:20px; background:#a49384; border:1px solid #282828;'></span> | `#a49384` |
|
|
||||||
| `text` | <span style='display:inline-block; width:50px; height:20px; background:#d4be98; border:1px solid #282828;'></span> | `#d4be98` |
|
|
||||||
| `text-bright` | <span style='display:inline-block; width:50px; height:20px; background:#d9c7a5; border:1px solid #282828;'></span> | `#d9c7a5` |
|
|
||||||
|
|
||||||
## Color Scales
|
|
||||||
|
|
||||||
### Color Scale: red
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#ea6962; border:1px solid #282828;'></span> | `#ea6962` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#e2615b; border:1px solid #282828;'></span> | `#e2615b` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#d95a54; border:1px solid #282828;'></span> | `#d95a54` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#d1544e; border:1px solid #282828;'></span> | `#d1544e` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#c64f49; border:1px solid #282828;'></span> | `#c64f49` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#e77a74; border:1px solid #282828;'></span> | `#e77a74` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#e58b86; border:1px solid #282828;'></span> | `#e58b86` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#e39b96; border:1px solid #282828;'></span> | `#e39b96` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#e3a9a6; border:1px solid #282828;'></span> | `#e3a9a6` |
|
|
||||||
|
|
||||||
### Color Scale: orange
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#e78a4e; border:1px solid #282828;'></span> | `#e78a4e` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#df8247; border:1px solid #282828;'></span> | `#df8247` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#d57b41; border:1px solid #282828;'></span> | `#d57b41` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#cc743c; border:1px solid #282828;'></span> | `#cc743c` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#bc6e3c; border:1px solid #282828;'></span> | `#bc6e3c` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#e39461; border:1px solid #282828;'></span> | `#e39461` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#e19e73; border:1px solid #282828;'></span> | `#e19e73` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#dea884; border:1px solid #282828;'></span> | `#dea884` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#ddb195; border:1px solid #282828;'></span> | `#ddb195` |
|
|
||||||
|
|
||||||
### Color Scale: yellow
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#d8a657; border:1px solid #282828;'></span> | `#d8a657` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#ce9e52; border:1px solid #282828;'></span> | `#ce9e52` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#c4964c; border:1px solid #282828;'></span> | `#c4964c` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#b88d49; border:1px solid #282828;'></span> | `#b88d49` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#a7834b; border:1px solid #282828;'></span> | `#a7834b` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#d5ac69; border:1px solid #282828;'></span> | `#d5ac69` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#d3b17b; border:1px solid #282828;'></span> | `#d3b17b` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#d3b78a; border:1px solid #282828;'></span> | `#d3b78a` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#d3bc9a; border:1px solid #282828;'></span> | `#d3bc9a` |
|
|
||||||
|
|
||||||
### Color Scale: olive
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#b9b25f; border:1px solid #282828;'></span> | `#b9b25f` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#ada75b; border:1px solid #282828;'></span> | `#ada75b` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#9e995b; border:1px solid #282828;'></span> | `#9e995b` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#8e8a5c; border:1px solid #282828;'></span> | `#8e8a5c` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#7e7b5d; border:1px solid #282828;'></span> | `#7e7b5d` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#b8b270; border:1px solid #282828;'></span> | `#b8b270` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#b6b280; border:1px solid #282828;'></span> | `#b6b280` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#b6b390; border:1px solid #282828;'></span> | `#b6b390` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#b8b69e; border:1px solid #282828;'></span> | `#b8b69e` |
|
|
||||||
|
|
||||||
### Color Scale: green
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#a9b665; border:1px solid #282828;'></span> | `#a9b665` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#9eaa62; border:1px solid #282828;'></span> | `#9eaa62` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#939c60; border:1px solid #282828;'></span> | `#939c60` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#858c61; border:1px solid #282828;'></span> | `#858c61` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#787b62; border:1px solid #282828;'></span> | `#787b62` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#abb575; border:1px solid #282828;'></span> | `#abb575` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#adb486; border:1px solid #282828;'></span> | `#adb486` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#afb594; border:1px solid #282828;'></span> | `#afb594` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#b3b6a3; border:1px solid #282828;'></span> | `#b3b6a3` |
|
|
||||||
|
|
||||||
### Color Scale: teal
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#89b482; border:1px solid #282828;'></span> | `#89b482` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#85a87e; border:1px solid #282828;'></span> | `#85a87e` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#819b7d; border:1px solid #282828;'></span> | `#819b7d` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#7e8d7b; border:1px solid #282828;'></span> | `#7e8d7b` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#7b7e7b; border:1px solid #282828;'></span> | `#7b7e7b` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#96b492; border:1px solid #282828;'></span> | `#96b492` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#a2b59f; border:1px solid #282828;'></span> | `#a2b59f` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#aeb7ad; border:1px solid #282828;'></span> | `#aeb7ad` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#b9bab9; border:1px solid #282828;'></span> | `#b9bab9` |
|
|
||||||
|
|
||||||
### Color Scale: blue
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#7daea3; border:1px solid #282828;'></span> | `#7daea3` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#7ba198; border:1px solid #282828;'></span> | `#7ba198` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#79938e; border:1px solid #282828;'></span> | `#79938e` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#788582; border:1px solid #282828;'></span> | `#788582` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#777777; border:1px solid #282828;'></span> | `#777777` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#8caea7; border:1px solid #282828;'></span> | `#8caea7` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#9bafaa; border:1px solid #282828;'></span> | `#9bafaa` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#a8b1af; border:1px solid #282828;'></span> | `#a8b1af` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#b4b4b4; border:1px solid #282828;'></span> | `#b4b4b4` |
|
|
||||||
|
|
||||||
### Color Scale: violet
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#d892c1; border:1px solid #282828;'></span> | `#d892c1` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#cf8cb9; border:1px solid #282828;'></span> | `#cf8cb9` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#c586b0; border:1px solid #282828;'></span> | `#c586b0` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#bb81a8; border:1px solid #282828;'></span> | `#bb81a8` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#af7e9f; border:1px solid #282828;'></span> | `#af7e9f` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#d8a1c6; border:1px solid #282828;'></span> | `#d8a1c6` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#d9b0cc; border:1px solid #282828;'></span> | `#d9b0cc` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#dbbdd1; border:1px solid #282828;'></span> | `#dbbdd1` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#dec9d7; border:1px solid #282828;'></span> | `#dec9d7` |
|
|
||||||
|
|
||||||
### Color Scale: purple
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#d3869b; border:1px solid #282828;'></span> | `#d3869b` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#ca8094; border:1px solid #282828;'></span> | `#ca8094` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#bf7c8e; border:1px solid #282828;'></span> | `#bf7c8e` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#b47788; border:1px solid #282828;'></span> | `#b47788` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#a87482; border:1px solid #282828;'></span> | `#a87482` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#d395a6; border:1px solid #282828;'></span> | `#d395a6` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#d3a4b1; border:1px solid #282828;'></span> | `#d3a4b1` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#d4b3bc; border:1px solid #282828;'></span> | `#d4b3bc` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#d7bfc6; border:1px solid #282828;'></span> | `#d7bfc6` |
|
|
||||||
|
|
||||||
### Color Scale: pink
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#cf91be; border:1px solid #282828;'></span> | `#cf91be` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#c58bb6; border:1px solid #282828;'></span> | `#c58bb6` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#bb87ac; border:1px solid #282828;'></span> | `#bb87ac` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#af83a3; border:1px solid #282828;'></span> | `#af83a3` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#a28099; border:1px solid #282828;'></span> | `#a28099` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#d0a0c2; border:1px solid #282828;'></span> | `#d0a0c2` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#d0aec7; border:1px solid #282828;'></span> | `#d0aec7` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#d3bbcc; border:1px solid #282828;'></span> | `#d3bbcc` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#d6c8d2; border:1px solid #282828;'></span> | `#d6c8d2` |
|
|
||||||
|
|
||||||
### Color Scale: brown
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#a87757; border:1px solid #282828;'></span> | `#a87757` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#977259; border:1px solid #282828;'></span> | `#977259` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#876c5a; border:1px solid #282828;'></span> | `#876c5a` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#77665a; border:1px solid #282828;'></span> | `#77665a` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#695f59; border:1px solid #282828;'></span> | `#695f59` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#a68168; border:1px solid #282828;'></span> | `#a68168` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#a58a79; border:1px solid #282828;'></span> | `#a58a79` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#a59388; border:1px solid #282828;'></span> | `#a59388` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#a69d96; border:1px solid #282828;'></span> | `#a69d96` |
|
|
||||||
|
|
||||||
### Color Scale: primary
|
|
||||||
|
|
||||||
| Name | Preview | Hex |
|
|
||||||
| ---- | ------- | --- |
|
|
||||||
|
|
||||||
| `base` | <span style='display:inline-block; width:50px; height:20px; background:#ea6962; border:1px solid #282828;'></span> | `#ea6962` |
|
|
||||||
| `down1` | <span style='display:inline-block; width:50px; height:20px; background:#e2615b; border:1px solid #282828;'></span> | `#e2615b` |
|
|
||||||
| `down2` | <span style='display:inline-block; width:50px; height:20px; background:#d95a54; border:1px solid #282828;'></span> | `#d95a54` |
|
|
||||||
| `down3` | <span style='display:inline-block; width:50px; height:20px; background:#d1544e; border:1px solid #282828;'></span> | `#d1544e` |
|
|
||||||
| `down4` | <span style='display:inline-block; width:50px; height:20px; background:#c64f49; border:1px solid #282828;'></span> | `#c64f49` |
|
|
||||||
| `up1` | <span style='display:inline-block; width:50px; height:20px; background:#e77a74; border:1px solid #282828;'></span> | `#e77a74` |
|
|
||||||
| `up2` | <span style='display:inline-block; width:50px; height:20px; background:#e58b86; border:1px solid #282828;'></span> | `#e58b86` |
|
|
||||||
| `up3` | <span style='display:inline-block; width:50px; height:20px; background:#e39b96; border:1px solid #282828;'></span> | `#e39b96` |
|
|
||||||
| `up4` | <span style='display:inline-block; width:50px; height:20px; background:#e3a9a6; border:1px solid #282828;'></span> | `#e3a9a6` |
|
|
||||||
|
|
||||||
## Usage
|
|
||||||
|
|
||||||
This color scheme is generated using Nix. To use these colors, you can:
|
|
||||||
|
|
||||||
1. Import the color scheme directly in your Nix configuration
|
|
||||||
2. Generate theme files for your preferred applications
|
|
||||||
3. Use the hex values in your CSS/HTML
|
|
||||||
|
|
||||||
## Notes
|
|
||||||
|
|
||||||
- All colors are in hexadecimal format
|
|
||||||
- Preview squares show approximate colors (may vary by display)
|
|
||||||
- Neutral shades provide a range from lightest (50) to darkest (900)
|
|
||||||
- Color scales provide variations for UI elements
|
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
inherit (inputs) nixpkgs;
|
inherit (inputs) nixpkgs;
|
||||||
inherit (lib) singleton recursiveUpdate mkDefault;
|
inherit (lib) singleton recursiveUpdate mkDefault;
|
||||||
inherit (builtins) concatLists;
|
inherit (builtins) concatLists;
|
||||||
inherit (self) keys;
|
inherit (self) hozen keys;
|
||||||
hm = inputs.home-manager.nixosModules.home-manager;
|
hm = inputs.home-manager.nixosModules.home-manager;
|
||||||
agenix = inputs.agenix.nixosModules.default;
|
agenix = inputs.agenix.nixosModules.default;
|
||||||
nixosModules = "${self}/modules/nixos";
|
nixosModules = "${self}/modules/nixos";
|
||||||
|
|
@ -44,7 +44,7 @@
|
||||||
mkNixos {
|
mkNixos {
|
||||||
specialArgs =
|
specialArgs =
|
||||||
recursiveUpdate {
|
recursiveUpdate {
|
||||||
inherit keys lib inputs self inputs' self';
|
inherit hozen keys lib inputs self inputs' self';
|
||||||
}
|
}
|
||||||
specialArgs;
|
specialArgs;
|
||||||
modules = concatLists [
|
modules = concatLists [
|
||||||
|
|
|
||||||
|
|
@ -3,17 +3,14 @@
|
||||||
types,
|
types,
|
||||||
translate,
|
translate,
|
||||||
}: let
|
}: let
|
||||||
# base modification function
|
# Base modification functions
|
||||||
modifyHSL = hexStr: modifications: let
|
modifyHSL = hexStr: modifications: let
|
||||||
# convert hex to HSL
|
|
||||||
hslSet = translate.hex.toHSL.set hexStr;
|
hslSet = translate.hex.toHSL.set hexStr;
|
||||||
# apply modifications to get new HSL values
|
|
||||||
newHSL = types.hsl.set {
|
newHSL = types.hsl.set {
|
||||||
inherit (hslSet) h; # keep hue
|
inherit (hslSet) h;
|
||||||
l = math.clamp 0.0 1.0 (hslSet.l + (modifications.l or 0.0));
|
l = math.clamp 0.0 1.0 (hslSet.l + (modifications.l or 0.0));
|
||||||
s = math.clamp 0.0 1.0 (hslSet.s + (modifications.s or 0.0));
|
s = math.clamp 0.0 1.0 (hslSet.s + (modifications.s or 0.0));
|
||||||
};
|
};
|
||||||
# convert back to hex
|
|
||||||
rgbSet = translate.hsl.toRGB.set newHSL;
|
rgbSet = translate.hsl.toRGB.set newHSL;
|
||||||
in
|
in
|
||||||
translate.rgb.toHex.string rgbSet;
|
translate.rgb.toHex.string rgbSet;
|
||||||
|
|
@ -30,6 +27,8 @@
|
||||||
desaturate = amount: hexStr:
|
desaturate = amount: hexStr:
|
||||||
modifyHSL hexStr {s = (amount * -1) / 100.0;};
|
modifyHSL hexStr {s = (amount * -1) / 100.0;};
|
||||||
|
|
||||||
|
# opinionated scale generators for light/dark themes
|
||||||
|
# lighter/darker shades always desaturate
|
||||||
mkDarkColorScale = base: {
|
mkDarkColorScale = base: {
|
||||||
up4 = desaturate 24 (lighten 12 base);
|
up4 = desaturate 24 (lighten 12 base);
|
||||||
up3 = desaturate 18 (lighten 9 base);
|
up3 = desaturate 18 (lighten 9 base);
|
||||||
|
|
@ -54,10 +53,11 @@
|
||||||
up4 = desaturate 24 (darken 12 base);
|
up4 = desaturate 24 (darken 12 base);
|
||||||
};
|
};
|
||||||
|
|
||||||
mkDarkColorScheme = {
|
# core color scheme generator
|
||||||
shades,
|
mkColorScheme = {
|
||||||
|
type ? "dark",
|
||||||
|
neutrals ? {},
|
||||||
primary,
|
primary,
|
||||||
secondary,
|
|
||||||
red,
|
red,
|
||||||
orange,
|
orange,
|
||||||
yellow,
|
yellow,
|
||||||
|
|
@ -69,54 +69,252 @@
|
||||||
purple,
|
purple,
|
||||||
pink,
|
pink,
|
||||||
brown,
|
brown,
|
||||||
} @ args: {
|
} @ args: let
|
||||||
shade-50 = args.shades."50";
|
# Select scale function based on theme type
|
||||||
shade-100 = args.shades."100";
|
colorScale =
|
||||||
shade-150 = args.shades."150";
|
if type == "dark"
|
||||||
shade-200 = args.shades."200";
|
then mkDarkColorScale
|
||||||
shade-250 = args.shades."250";
|
else mkLightColorScale;
|
||||||
shade-300 = args.shades."300";
|
|
||||||
shade-350 = args.shades."350";
|
|
||||||
shade-400 = args.shades."400";
|
|
||||||
shade-450 = args.shades."450";
|
|
||||||
shade-500 = args.shades."500";
|
|
||||||
shade-550 = args.shades."550";
|
|
||||||
shade-600 = args.shades."600";
|
|
||||||
shade-650 = args.shades."650";
|
|
||||||
shade-700 = args.shades."700";
|
|
||||||
shade-750 = args.shades."750";
|
|
||||||
shade-800 = args.shades."800";
|
|
||||||
shade-850 = args.shades."850";
|
|
||||||
shade-900 = args.shades."900";
|
|
||||||
|
|
||||||
primary = mkDarkColorScale args.primary;
|
# Generate color scales
|
||||||
|
colorScales = {
|
||||||
|
red = colorScale args.red;
|
||||||
|
orange = colorScale args.orange;
|
||||||
|
yellow = colorScale args.yellow;
|
||||||
|
olive = colorScale args.olive;
|
||||||
|
green = colorScale args.green;
|
||||||
|
teal = colorScale args.teal;
|
||||||
|
blue = colorScale args.blue;
|
||||||
|
violet = colorScale args.violet;
|
||||||
|
purple = colorScale args.purple;
|
||||||
|
pink = colorScale args.pink;
|
||||||
|
brown = colorScale args.brown;
|
||||||
|
};
|
||||||
|
|
||||||
|
# Theme-specific configurations
|
||||||
|
themeConfig =
|
||||||
|
if type == "dark"
|
||||||
|
then {
|
||||||
|
semantic = {
|
||||||
|
body = args.neutrals."700";
|
||||||
|
header = args.neutrals."800";
|
||||||
|
footer = args.neutrals."800";
|
||||||
|
menu = args.neutrals."800";
|
||||||
|
border = args.neutrals."150";
|
||||||
|
border-active = args.neutrals."150";
|
||||||
|
border-inactive = args.neutrals."600";
|
||||||
|
text = args.neutrals."150";
|
||||||
|
text-bright = args.neutrals."100";
|
||||||
|
subtext = args.neutrals."300";
|
||||||
|
};
|
||||||
secondary = {
|
secondary = {
|
||||||
up-1 = args.shade."550";
|
up-4 = args.neutrals."400";
|
||||||
up-2 = args.shade."500";
|
up-3 = args.neutrals."450";
|
||||||
up-3 = args.shade."450";
|
up-2 = args.neutrals."500";
|
||||||
up-4 = args.shade."400";
|
up-1 = args.neutrals."550";
|
||||||
up-5 = args.shade."350";
|
base = args.neutrals."700";
|
||||||
up-6 = args.shade."300";
|
down-1 = args.neutrals."750";
|
||||||
up-7 = args.shade."250";
|
down-2 = args.neutrals."800";
|
||||||
up-8 = args.shade."200";
|
down-3 = args.neutrals."850";
|
||||||
up-9 = args.shade."150";
|
down-4 = args.neutrals."900";
|
||||||
up-10 = args.shade."100";
|
|
||||||
base = args.shade."700";
|
|
||||||
down-1 = args.shade."650";
|
|
||||||
down-2 = args.shade."700";
|
|
||||||
};
|
};
|
||||||
red = mkDarkColorScale args.red;
|
base00 = args.neutrals."800";
|
||||||
orange = mkDarkColorScale args.orange;
|
base01 = args.neutrals."700";
|
||||||
yellow = mkDarkColorScale args.yellow;
|
base02 = args.neutrals."600";
|
||||||
olive = mkDarkColorScale args.olive;
|
base03 = args.neutrals."450";
|
||||||
green = mkDarkColorScale args.green;
|
base04 = args.neutrals."300";
|
||||||
teal = mkDarkColorScale args.teal;
|
base05 = args.neutrals."150";
|
||||||
blue = mkDarkColorScale args.blue;
|
base06 = args.neutrals."100";
|
||||||
violet = mkDarkColorScale args.violet;
|
base07 = args.neutrals."50";
|
||||||
purple = mkDarkColorScale args.purple;
|
base10 = args.neutrals."850";
|
||||||
pink = mkDarkColorScale args.pink;
|
base11 = args.neutrals."900";
|
||||||
brown = mkDarkColorScale args.brown;
|
}
|
||||||
|
else {
|
||||||
|
semantic = {
|
||||||
|
body = args.neutrals."50";
|
||||||
|
header = args.neutrals."150";
|
||||||
|
footer = args.neutrals."150";
|
||||||
|
menu = args.neutrals."150";
|
||||||
|
border = args.neutrals."800";
|
||||||
|
border-active = args.neutrals."800";
|
||||||
|
border-inactive = args.neutrals."300";
|
||||||
|
text = args.neutrals."800";
|
||||||
|
text-bright = args.neutrals."850";
|
||||||
|
subtext = args.neutrals."600";
|
||||||
};
|
};
|
||||||
|
secondary = {
|
||||||
|
up-4 = args.neutrals."400";
|
||||||
|
up-3 = args.neutrals."350";
|
||||||
|
up-2 = args.neutrals."300";
|
||||||
|
up-1 = args.neutrals."250";
|
||||||
|
base = args.neutrals."200";
|
||||||
|
down-1 = args.neutrals."150";
|
||||||
|
down-2 = args.neutrals."100";
|
||||||
|
down-3 = args.neutrals."50";
|
||||||
|
down-4 = args.neutrals."50";
|
||||||
|
};
|
||||||
|
base00 = args.neutrals."150";
|
||||||
|
base01 = args.neutrals."250";
|
||||||
|
base02 = args.neutrals."450";
|
||||||
|
base03 = args.neutrals."550";
|
||||||
|
base04 = args.neutrals."650";
|
||||||
|
base05 = args.neutrals."800";
|
||||||
|
base06 = args.neutrals."850";
|
||||||
|
base07 = args.neutrals."900";
|
||||||
|
base10 = args.neutrals."100";
|
||||||
|
base11 = args.neutrals."50";
|
||||||
|
};
|
||||||
|
in {
|
||||||
|
# Common structure for both themes
|
||||||
|
neutrals = {
|
||||||
|
inherit
|
||||||
|
(args.neutrals)
|
||||||
|
"50"
|
||||||
|
"100"
|
||||||
|
"150"
|
||||||
|
"200"
|
||||||
|
"250"
|
||||||
|
"300"
|
||||||
|
"350"
|
||||||
|
"400"
|
||||||
|
"450"
|
||||||
|
"500"
|
||||||
|
"550"
|
||||||
|
"600"
|
||||||
|
"650"
|
||||||
|
"700"
|
||||||
|
"750"
|
||||||
|
"800"
|
||||||
|
"850"
|
||||||
|
"900"
|
||||||
|
;
|
||||||
|
};
|
||||||
|
|
||||||
|
inherit
|
||||||
|
(colorScales)
|
||||||
|
red
|
||||||
|
orange
|
||||||
|
yellow
|
||||||
|
olive
|
||||||
|
green
|
||||||
|
teal
|
||||||
|
blue
|
||||||
|
violet
|
||||||
|
purple
|
||||||
|
pink
|
||||||
|
brown
|
||||||
|
;
|
||||||
|
|
||||||
|
primary = colorScale args.primary;
|
||||||
|
|
||||||
|
inherit (themeConfig) semantic secondary;
|
||||||
|
|
||||||
|
# Status colors (same structure for both themes)
|
||||||
|
error = {
|
||||||
|
bg = "${colorScales.red.base}";
|
||||||
|
bg-active = "${colorScales.red.down1}";
|
||||||
|
bg-hover = "${colorScales.red.down2}";
|
||||||
|
text = "${themeConfig.semantic.text-bright}";
|
||||||
|
border = "${colorScales.red.up2}";
|
||||||
|
};
|
||||||
|
|
||||||
|
success = {
|
||||||
|
bg = "${colorScales.green.base}";
|
||||||
|
bg-active = "${colorScales.green.down1}";
|
||||||
|
bg-hover = "${colorScales.green.down2}";
|
||||||
|
text = "${themeConfig.semantic.text-bright}";
|
||||||
|
border = "${colorScales.green.up2}";
|
||||||
|
};
|
||||||
|
|
||||||
|
warning = {
|
||||||
|
bg = "${colorScales.yellow.base}";
|
||||||
|
bg-active = "${colorScales.yellow.down1}";
|
||||||
|
bg-hover = "${colorScales.yellow.down2}";
|
||||||
|
text = "${themeConfig.semantic.text-bright}";
|
||||||
|
border = "${colorScales.yellow.up2}";
|
||||||
|
};
|
||||||
|
|
||||||
|
info = {
|
||||||
|
bg = "${colorScales.blue.base}";
|
||||||
|
bg-active = "${colorScales.blue.down1}";
|
||||||
|
bg-hover = "${colorScales.blue.down2}";
|
||||||
|
text = "${themeConfig.semantic.text-bright}";
|
||||||
|
border = "${colorScales.blue.up2}";
|
||||||
|
};
|
||||||
|
|
||||||
|
tip = {
|
||||||
|
bg = "${colorScales.teal.base}";
|
||||||
|
bg-active = "${colorScales.teal.down1}";
|
||||||
|
bg-hover = "${colorScales.teal.down2}";
|
||||||
|
text = "${themeConfig.semantic.text-bright}";
|
||||||
|
border = "${colorScales.teal.up2}";
|
||||||
|
};
|
||||||
|
|
||||||
|
# Syntax highlighting (same for both themes)
|
||||||
|
syntax = {
|
||||||
|
string = args.green;
|
||||||
|
number = args.purple;
|
||||||
|
float = args.purple;
|
||||||
|
boolean = args.purple;
|
||||||
|
type = args.yellow;
|
||||||
|
structure = args.orange;
|
||||||
|
statement = args.red;
|
||||||
|
label = args.orange;
|
||||||
|
operator = args.orange;
|
||||||
|
identifier = args.blue;
|
||||||
|
function = args.green;
|
||||||
|
storageClass = args.orange;
|
||||||
|
constant = args.teal;
|
||||||
|
exception = args.red;
|
||||||
|
preproc = args.purple;
|
||||||
|
include = args.purple;
|
||||||
|
define = args.purple;
|
||||||
|
macro = args.teal;
|
||||||
|
preCondit = args.purple;
|
||||||
|
special = args.yellow;
|
||||||
|
specialChar = args.yellow;
|
||||||
|
comment = "${themeConfig.semantic.subtext}";
|
||||||
|
todo = args.purple;
|
||||||
|
tag = args.teal;
|
||||||
|
};
|
||||||
|
|
||||||
|
# Base16/24 colors
|
||||||
|
inherit
|
||||||
|
(themeConfig)
|
||||||
|
base00
|
||||||
|
base01
|
||||||
|
base02
|
||||||
|
base03
|
||||||
|
base04
|
||||||
|
base05
|
||||||
|
base06
|
||||||
|
base07
|
||||||
|
base10
|
||||||
|
base11
|
||||||
|
;
|
||||||
|
|
||||||
|
# Generated base colors
|
||||||
|
base08 = args.red;
|
||||||
|
base09 = args.orange;
|
||||||
|
base0A = args.yellow;
|
||||||
|
base0B = args.green;
|
||||||
|
base0C = args.teal;
|
||||||
|
base0D = args.blue;
|
||||||
|
base0E = args.purple;
|
||||||
|
base0F = args.brown;
|
||||||
|
base12 = "${colorScales.red.up2}";
|
||||||
|
base13 = "${colorScales.yellow.up2}";
|
||||||
|
base14 = "${colorScales.green.up2}";
|
||||||
|
base15 = "${colorScales.teal.up2}";
|
||||||
|
base16 = "${colorScales.blue.up2}";
|
||||||
|
base17 = "${colorScales.purple.up2}";
|
||||||
|
};
|
||||||
|
|
||||||
|
# wrappers
|
||||||
|
mkDarkColorScheme = args: mkColorScheme (args // {type = "dark";});
|
||||||
|
mkLightColorScheme = args: mkColorScheme (args // {type = "light";});
|
||||||
in {
|
in {
|
||||||
inherit lighten darken saturate desaturate mkLightColorScale mkDarkColorScale mkDarkColorScheme;
|
inherit lighten darken saturate desaturate;
|
||||||
|
inherit mkDarkColorScale mkLightColorScale;
|
||||||
|
inherit mkColorScheme mkDarkColorScheme mkLightColorScheme;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -25,8 +25,7 @@
|
||||||
inherit types translate;
|
inherit types translate;
|
||||||
};
|
};
|
||||||
in {
|
in {
|
||||||
inherit check types translate;
|
inherit check types translate utils;
|
||||||
inherit (utils) lighten darken saturate desaturate mkColorScale;
|
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
in {
|
in {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue