Last active
December 30, 2025 01:05
-
-
Save Zinvoke/4326d97640c5296610c8b3f6a36b0544 to your computer and use it in GitHub Desktop.
Catppuccin Userstyle Lib
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* deno-fmt-ignore */ | |
| @catppuccin: { | |
| @latte: { | |
| @rosewater: #dc8a78; | |
| @flamingo: #dd7878; | |
| @pink: #ea76cb; | |
| @mauve: #8839ef; | |
| @red: #d20f39; | |
| @maroon: #e64553; | |
| @peach: #fe640b; | |
| @yellow: #df8e1d; | |
| @green: #40a02b; | |
| @teal: #179299; | |
| @sky: #04a5e5; | |
| @sapphire: #209fb5; | |
| @blue: #1e66f5; | |
| @lavender: #7287fd; | |
| @text: #4c4f69; | |
| @subtext1: #5c5f77; | |
| @subtext0: #6c6f85; | |
| @overlay2: #7c7f93; | |
| @overlay1: #8c8fa1; | |
| @overlay0: #9ca0b0; | |
| @surface2: #acb0be; | |
| @surface1: #bcc0cc; | |
| @surface0: #ccd0da; | |
| @base: #eff1f5; | |
| @mantle: #e6e9ef; | |
| @crust: #dce0e8; | |
| }; | |
| @frappe: { | |
| @rosewater: #f2d5cf; | |
| @flamingo: #eebebe; | |
| @pink: #f4b8e4; | |
| @mauve: #ca9ee6; | |
| @red: #e78284; | |
| @maroon: #ea999c; | |
| @peach: #ef9f76; | |
| @yellow: #e5c890; | |
| @green: #a6d189; | |
| @teal: #81c8be; | |
| @sky: #99d1db; | |
| @sapphire: #85c1dc; | |
| @blue: #8caaee; | |
| @lavender: #babbf1; | |
| @text: #c6d0f5; | |
| @subtext1: #b5bfe2; | |
| @subtext0: #a5adce; | |
| @overlay2: #949cbb; | |
| @overlay1: #838ba7; | |
| @overlay0: #737994; | |
| @surface2: #626880; | |
| @surface1: #51576d; | |
| @surface0: #414559; | |
| @base: #303446; | |
| @mantle: #292c3c; | |
| @crust: #232634; | |
| }; | |
| @macchiato: { | |
| @rosewater: #f4dbd6; | |
| @flamingo: #f0c6c6; | |
| @pink: #f5bde6; | |
| @mauve: #c6a0f6; | |
| @red: #ed8796; | |
| @maroon: #ee99a0; | |
| @peach: #f5a97f; | |
| @yellow: #eed49f; | |
| @green: #a6da95; | |
| @teal: #8bd5ca; | |
| @sky: #91d7e3; | |
| @sapphire: #7dc4e4; | |
| @blue: #8aadf4; | |
| @lavender: #b7bdf8; | |
| @text: #cad3f5; | |
| @subtext1: #b8c0e0; | |
| @subtext0: #a5adcb; | |
| @overlay2: #939ab7; | |
| @overlay1: #8087a2; | |
| @overlay0: #6e738d; | |
| @surface2: #5b6078; | |
| @surface1: #494d64; | |
| @surface0: #363a4f; | |
| @base: #24273a; | |
| @mantle: #1e2030; | |
| @crust: #181926; | |
| }; | |
| @mocha: { | |
| @crust: #232a2e; | |
| @mantle: #2d353b; | |
| @base: #343f44; | |
| @surface0: #3d484d; | |
| @surface1: #475258; | |
| @surface2: #4f585e; | |
| @overlay0: #56635f; | |
| @overlay1: #7a8478; | |
| @overlay2: #859289; | |
| @subtext0: #859289; | |
| @subtext1: #9da9a0; | |
| @text: #d3c6aa; | |
| @lavender: #d699b6; | |
| @blue: #7fbbb3; | |
| @sapphire: #7fbbb3; | |
| @sky: #83c092; | |
| @teal: #83c092; | |
| @green: #a7c080; | |
| @yellow: #dbbc7f; | |
| @peach: #e69875; | |
| @maroon: #e67e80; | |
| @red: #e67e80; | |
| @mauve: #d699b6; | |
| @pink: #d699b6; | |
| @flamingo: #e67e80; | |
| @rosewater: #dbbc7f; | |
| }; | |
| }; | |
| /* deno-fmt-ignore */ | |
| @catppuccin-filters: { | |
| @latte: { | |
| @rosewater: brightness(0) saturate(100%) invert(65%) sepia(18%) | |
| saturate(1048%) hue-rotate(323deg) brightness(92%) contrast(86%); | |
| @flamingo: brightness(0) saturate(100%) invert(84%) sepia(44%) | |
| saturate(4533%) hue-rotate(310deg) brightness(98%) contrast(75%); | |
| @pink: brightness(0) saturate(100%) invert(60%) sepia(32%) saturate(775%) | |
| hue-rotate(266deg) brightness(93%) contrast(97%); | |
| @mauve: brightness(0) saturate(100%) invert(26%) sepia(59%) saturate(3315%) | |
| hue-rotate(255deg) brightness(94%) contrast(100%); | |
| @red: brightness(0) saturate(100%) invert(16%) sepia(78%) saturate(7275%) | |
| hue-rotate(342deg) brightness(84%) contrast(94%); | |
| @maroon: brightness(0) saturate(100%) invert(31%) sepia(56%) saturate(2395%) | |
| hue-rotate(331deg) brightness(99%) contrast(82%); | |
| @peach: brightness(0) saturate(100%) invert(38%) sepia(81%) saturate(1292%) | |
| hue-rotate(356deg) brightness(103%) contrast(99%); | |
| @yellow: brightness(0) saturate(100%) invert(74%) sepia(47%) saturate(4570%) | |
| hue-rotate(354deg) brightness(95%) contrast(83%); | |
| @green: brightness(0) saturate(100%) invert(51%) sepia(25%) saturate(4134%) | |
| hue-rotate(76deg) brightness(95%) contrast(66%); | |
| @teal: brightness(0) saturate(100%) invert(41%) sepia(45%) saturate(1101%) | |
| hue-rotate(139deg) brightness(100%) contrast(82%); | |
| @sky: brightness(0) saturate(100%) invert(47%) sepia(76%) saturate(2427%) | |
| hue-rotate(166deg) brightness(99%) contrast(97%); | |
| @sapphire: brightness(0) saturate(100%) invert(52%) sepia(41%) | |
| saturate(6982%) hue-rotate(160deg) brightness(102%) contrast(75%); | |
| @blue: brightness(0) saturate(100%) invert(30%) sepia(80%) saturate(1850%) | |
| hue-rotate(209deg) brightness(94%) contrast(105%); | |
| @lavender: brightness(0) saturate(100%) invert(48%) sepia(61%) | |
| saturate(538%) hue-rotate(194deg) brightness(102%) contrast(98%); | |
| @text: brightness(0) saturate(100%) invert(30%) sepia(10%) saturate(1259%) | |
| hue-rotate(196deg) brightness(97%) contrast(91%); | |
| @subtext1: brightness(0) saturate(100%) invert(36%) sepia(10%) | |
| saturate(890%) hue-rotate(196deg) brightness(98%) contrast(90%); | |
| @subtext0: brightness(0) saturate(100%) invert(47%) sepia(6%) | |
| saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%); | |
| @overlay2: brightness(0) saturate(100%) invert(59%) sepia(7%) saturate(825%) | |
| hue-rotate(195deg) brightness(83%) contrast(91%); | |
| @overlay1: brightness(0) saturate(100%) invert(59%) sepia(14%) | |
| saturate(333%) hue-rotate(194deg) brightness(95%) contrast(89%); | |
| @overlay0: brightness(0) saturate(100%) invert(85%) sepia(7%) saturate(595%) | |
| hue-rotate(191deg) brightness(77%) contrast(81%); | |
| @surface2: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(482%) | |
| hue-rotate(189deg) brightness(82%) contrast(88%); | |
| @surface1: brightness(0) saturate(100%) invert(85%) sepia(8%) saturate(281%) | |
| hue-rotate(187deg) brightness(92%) contrast(88%); | |
| @surface0: brightness(0) saturate(100%) invert(96%) sepia(1%) | |
| saturate(5123%) hue-rotate(185deg) brightness(93%) contrast(83%); | |
| @base: brightness(0) saturate(100%) invert(89%) sepia(5%) saturate(140%) | |
| hue-rotate(182deg) brightness(109%) contrast(94%); | |
| @mantle: brightness(0) saturate(100%) invert(93%) sepia(19%) saturate(55%) | |
| hue-rotate(182deg) brightness(98%) contrast(92%); | |
| @crust: brightness(0) saturate(100%) invert(91%) sepia(1%) saturate(4489%) | |
| hue-rotate(196deg) brightness(106%) contrast(82%); | |
| }; | |
| @frappe: { | |
| @rosewater: brightness(0) saturate(100%) invert(90%) sepia(6%) | |
| saturate(734%) hue-rotate(321deg) brightness(95%) contrast(99%); | |
| @flamingo: brightness(0) saturate(100%) invert(88%) sepia(52%) | |
| saturate(817%) hue-rotate(293deg) brightness(113%) contrast(84%); | |
| @pink: brightness(0) saturate(100%) invert(76%) sepia(15%) saturate(844%) | |
| hue-rotate(280deg) brightness(107%) contrast(91%); | |
| @mauve: brightness(0) saturate(100%) invert(71%) sepia(25%) saturate(725%) | |
| hue-rotate(225deg) brightness(94%) contrast(91%); | |
| @red: brightness(0) saturate(100%) invert(67%) sepia(3%) saturate(7209%) | |
| hue-rotate(305deg) brightness(91%) contrast(99%); | |
| @maroon: brightness(0) saturate(100%) invert(61%) sepia(14%) saturate(957%) | |
| hue-rotate(307deg) brightness(109%) contrast(90%); | |
| @peach: brightness(0) saturate(100%) invert(68%) sepia(28%) saturate(662%) | |
| hue-rotate(335deg) brightness(96%) contrast(94%); | |
| @yellow: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(684%) | |
| hue-rotate(309deg) brightness(105%) contrast(80%); | |
| @green: brightness(0) saturate(100%) invert(89%) sepia(23%) saturate(582%) | |
| hue-rotate(42deg) brightness(87%) contrast(89%); | |
| @teal: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(986%) | |
| hue-rotate(110deg) brightness(85%) contrast(81%); | |
| @sky: brightness(0) saturate(100%) invert(75%) sepia(15%) saturate(623%) | |
| hue-rotate(141deg) brightness(109%) contrast(81%); | |
| @sapphire: brightness(0) saturate(100%) invert(77%) sepia(20%) | |
| saturate(730%) hue-rotate(157deg) brightness(97%) contrast(76%); | |
| @blue: brightness(0) saturate(100%) invert(68%) sepia(16%) saturate(1070%) | |
| hue-rotate(185deg) brightness(96%) contrast(95%); | |
| @lavender: brightness(0) saturate(100%) invert(75%) sepia(20%) | |
| saturate(626%) hue-rotate(201deg) brightness(101%) contrast(89%); | |
| @text: brightness(0) saturate(100%) invert(83%) sepia(12%) saturate(582%) | |
| hue-rotate(191deg) brightness(98%) contrast(96%); | |
| @subtext1: brightness(0) saturate(100%) invert(80%) sepia(18%) | |
| saturate(411%) hue-rotate(190deg) brightness(96%) contrast(84%); | |
| @subtext0: brightness(0) saturate(100%) invert(82%) sepia(6%) | |
| saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%); | |
| @overlay2: brightness(0) saturate(100%) invert(65%) sepia(36%) | |
| saturate(230%) hue-rotate(190deg) brightness(92%) contrast(82%); | |
| @overlay1: brightness(0) saturate(100%) invert(55%) sepia(12%) | |
| saturate(638%) hue-rotate(189deg) brightness(98%) contrast(87%); | |
| @overlay0: brightness(0) saturate(100%) invert(49%) sepia(13%) | |
| saturate(662%) hue-rotate(192deg) brightness(94%) contrast(84%); | |
| @surface2: brightness(0) saturate(100%) invert(41%) sepia(20%) | |
| saturate(469%) hue-rotate(191deg) brightness(93%) contrast(86%); | |
| @surface1: brightness(0) saturate(100%) invert(34%) sepia(14%) | |
| saturate(771%) hue-rotate(190deg) brightness(89%) contrast(85%); | |
| @surface0: brightness(0) saturate(100%) invert(28%) sepia(7%) | |
| saturate(1468%) hue-rotate(193deg) brightness(92%) contrast(95%); | |
| @base: brightness(0) saturate(100%) invert(20%) sepia(17%) saturate(747%) | |
| hue-rotate(192deg) brightness(96%) contrast(97%); | |
| @mantle: brightness(0) saturate(100%) invert(8%) sepia(7%) saturate(7271%) | |
| hue-rotate(198deg) brightness(88%) contrast(75%); | |
| @crust: brightness(0) saturate(100%) invert(7%) sepia(7%) saturate(7415%) | |
| hue-rotate(197deg) brightness(86%) contrast(79%); | |
| }; | |
| @macchiato: { | |
| @rosewater: brightness(0) saturate(100%) invert(88%) sepia(13%) | |
| saturate(322%) hue-rotate(321deg) brightness(102%) contrast(91%); | |
| @flamingo: brightness(0) saturate(100%) invert(82%) sepia(3%) | |
| saturate(3070%) hue-rotate(314deg) brightness(107%) contrast(88%); | |
| @pink: brightness(0) saturate(100%) invert(80%) sepia(23%) saturate(509%) | |
| hue-rotate(280deg) brightness(102%) contrast(92%); | |
| @mauve: brightness(0) saturate(100%) invert(65%) sepia(18%) saturate(903%) | |
| hue-rotate(222deg) brightness(104%) contrast(93%); | |
| @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(1541%) | |
| hue-rotate(305deg) brightness(110%) contrast(86%); | |
| @maroon: brightness(0) saturate(100%) invert(71%) sepia(10%) saturate(1331%) | |
| hue-rotate(306deg) brightness(93%) contrast(101%); | |
| @peach: brightness(0) saturate(100%) invert(73%) sepia(13%) saturate(1676%) | |
| hue-rotate(330deg) brightness(103%) contrast(92%); | |
| @yellow: brightness(0) saturate(100%) invert(87%) sepia(89%) saturate(321%) | |
| hue-rotate(314deg) brightness(101%) contrast(87%); | |
| @green: brightness(0) saturate(100%) invert(93%) sepia(12%) saturate(1128%) | |
| hue-rotate(48deg) brightness(92%) contrast(85%); | |
| @teal: brightness(0) saturate(100%) invert(92%) sepia(10%) saturate(1176%) | |
| hue-rotate(110deg) brightness(87%) contrast(90%); | |
| @sky: brightness(0) saturate(100%) invert(78%) sepia(57%) saturate(230%) | |
| hue-rotate(142deg) brightness(96%) contrast(84%); | |
| @sapphire: brightness(0) saturate(100%) invert(74%) sepia(35%) | |
| saturate(438%) hue-rotate(156deg) brightness(92%) contrast(93%); | |
| @blue: brightness(0) saturate(100%) invert(67%) sepia(17%) saturate(1007%) | |
| hue-rotate(183deg) brightness(99%) contrast(94%); | |
| @lavender: brightness(0) saturate(100%) invert(74%) sepia(6%) | |
| saturate(2559%) hue-rotate(198deg) brightness(103%) contrast(94%); | |
| @text: brightness(0) saturate(100%) invert(81%) sepia(9%) saturate(726%) | |
| hue-rotate(192deg) brightness(104%) contrast(92%); | |
| @subtext1: brightness(0) saturate(100%) invert(84%) sepia(5%) | |
| saturate(1453%) hue-rotate(193deg) brightness(94%) contrast(86%); | |
| @subtext0: brightness(0) saturate(100%) invert(75%) sepia(18%) | |
| saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%); | |
| @overlay2: brightness(0) saturate(100%) invert(67%) sepia(9%) saturate(814%) | |
| hue-rotate(191deg) brightness(92%) contrast(88%); | |
| @overlay1: brightness(0) saturate(100%) invert(49%) sepia(38%) | |
| saturate(203%) hue-rotate(190deg) brightness(101%) contrast(93%); | |
| @overlay0: brightness(0) saturate(100%) invert(46%) sepia(16%) | |
| saturate(552%) hue-rotate(193deg) brightness(93%) contrast(84%); | |
| @surface2: brightness(0) saturate(100%) invert(34%) sepia(16%) | |
| saturate(611%) hue-rotate(192deg) brightness(101%) contrast(87%); | |
| @surface1: brightness(0) saturate(100%) invert(30%) sepia(11%) | |
| saturate(1085%) hue-rotate(194deg) brightness(92%) contrast(89%); | |
| @surface0: brightness(0) saturate(100%) invert(18%) sepia(21%) | |
| saturate(880%) hue-rotate(193deg) brightness(97%) contrast(84%); | |
| @base: brightness(0) saturate(100%) invert(12%) sepia(42%) saturate(570%) | |
| hue-rotate(194deg) brightness(90%) contrast(90%); | |
| @mantle: brightness(0) saturate(100%) invert(6%) sepia(6%) saturate(7499%) | |
| hue-rotate(200deg) brightness(93%) contrast(85%); | |
| @crust: brightness(0) saturate(100%) invert(5%) sepia(8%) saturate(5346%) | |
| hue-rotate(202deg) brightness(98%) contrast(88%); | |
| }; | |
| @mocha: { | |
| @rosewater: brightness(0) saturate(100%) invert(92%) sepia(5%) | |
| saturate(704%) hue-rotate(320deg) brightness(99%) contrast(93%); | |
| @flamingo: brightness(0) saturate(100%) invert(81%) sepia(5%) saturate(987%) | |
| hue-rotate(315deg) brightness(107%) contrast(90%); | |
| @pink: brightness(0) saturate(100%) invert(86%) sepia(11%) saturate(1177%) | |
| hue-rotate(283deg) brightness(101%) contrast(92%); | |
| @mauve: brightness(0) saturate(100%) invert(65%) sepia(58%) saturate(255%) | |
| hue-rotate(224deg) brightness(96%) contrast(102%); | |
| @red: brightness(0) saturate(100%) invert(61%) sepia(19%) saturate(997%) | |
| hue-rotate(294deg) brightness(104%) contrast(91%); | |
| @maroon: brightness(0) saturate(100%) invert(66%) sepia(16%) saturate(1301%) | |
| hue-rotate(306deg) brightness(116%) contrast(84%); | |
| @peach: brightness(0) saturate(100%) invert(68%) sepia(57%) saturate(278%) | |
| hue-rotate(338deg) brightness(98%) contrast(101%); | |
| @yellow: brightness(0) saturate(100%) invert(90%) sepia(70%) saturate(380%) | |
| hue-rotate(313deg) brightness(102%) contrast(95%); | |
| @green: brightness(0) saturate(100%) invert(88%) sepia(6%) saturate(2015%) | |
| hue-rotate(63deg) brightness(104%) contrast(78%); | |
| @teal: brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(991%) | |
| hue-rotate(108deg) brightness(93%) contrast(90%); | |
| @sky: brightness(0) saturate(100%) invert(84%) sepia(21%) saturate(1302%) | |
| hue-rotate(164deg) brightness(106%) contrast(84%); | |
| @sapphire: brightness(0) saturate(100%) invert(74%) sepia(20%) | |
| saturate(876%) hue-rotate(156deg) brightness(96%) contrast(93%); | |
| @blue: brightness(0) saturate(100%) invert(68%) sepia(18%) saturate(951%) | |
| hue-rotate(180deg) brightness(98%) contrast(100%); | |
| @lavender: brightness(0) saturate(100%) invert(73%) sepia(7%) | |
| saturate(1670%) hue-rotate(195deg) brightness(102%) contrast(99%); | |
| @text: brightness(0) saturate(100%) invert(86%) sepia(6%) saturate(879%) | |
| hue-rotate(190deg) brightness(100%) contrast(93%); | |
| @subtext1: brightness(0) saturate(100%) invert(84%) sepia(19%) | |
| saturate(381%) hue-rotate(193deg) brightness(91%) contrast(89%); | |
| @subtext0: brightness(0) saturate(100%) invert(84%) sepia(9%) saturate(767%) | |
| hue-rotate(192deg) brightness(84%) contrast(84%); | |
| @overlay2: brightness(0) saturate(100%) invert(63%) sepia(15%) | |
| saturate(428%) hue-rotate(191deg) brightness(96%) contrast(84%); | |
| @overlay1: brightness(0) saturate(100%) invert(56%) sepia(15%) | |
| saturate(455%) hue-rotate(192deg) brightness(90%) contrast(88%); | |
| @overlay0: brightness(0) saturate(100%) invert(44%) sepia(6%) | |
| saturate(1275%) hue-rotate(194deg) brightness(97%) contrast(88%); | |
| @surface2: brightness(0) saturate(100%) invert(34%) sepia(8%) | |
| saturate(1015%) hue-rotate(195deg) brightness(99%) contrast(89%); | |
| @surface1: brightness(0) saturate(100%) invert(25%) sepia(6%) | |
| saturate(1950%) hue-rotate(197deg) brightness(99%) contrast(86%); | |
| @surface0: brightness(0) saturate(100%) invert(19%) sepia(5%) | |
| saturate(2844%) hue-rotate(199deg) brightness(91%) contrast(93%); | |
| @base: brightness(0) saturate(100%) invert(7%) sepia(4%) saturate(7496%) | |
| hue-rotate(202deg) brightness(93%) contrast(87%); | |
| @mantle: brightness(0) saturate(100%) invert(6%) sepia(4%) saturate(7465%) | |
| hue-rotate(202deg) brightness(95%) contrast(90%); | |
| @crust: brightness(0) saturate(100%) invert(3%) sepia(13%) saturate(6863%) | |
| hue-rotate(220deg) brightness(95%) contrast(91%); | |
| }; | |
| }; | |
| #lib { | |
| .palette() { | |
| @rosewater: @catppuccin[@@flavor][@rosewater]; | |
| @flamingo: @catppuccin[@@flavor][@flamingo]; | |
| @pink: @catppuccin[@@flavor][@pink]; | |
| @mauve: @catppuccin[@@flavor][@mauve]; | |
| @red: @catppuccin[@@flavor][@red]; | |
| @maroon: @catppuccin[@@flavor][@maroon]; | |
| @peach: @catppuccin[@@flavor][@peach]; | |
| @yellow: @catppuccin[@@flavor][@yellow]; | |
| @green: @catppuccin[@@flavor][@green]; | |
| @teal: @catppuccin[@@flavor][@teal]; | |
| @sky: @catppuccin[@@flavor][@sky]; | |
| @sapphire: @catppuccin[@@flavor][@sapphire]; | |
| @blue: @catppuccin[@@flavor][@blue]; | |
| @lavender: @catppuccin[@@flavor][@lavender]; | |
| @text: @catppuccin[@@flavor][@text]; | |
| @subtext1: @catppuccin[@@flavor][@subtext1]; | |
| @subtext0: @catppuccin[@@flavor][@subtext0]; | |
| @overlay2: @catppuccin[@@flavor][@overlay2]; | |
| @overlay1: @catppuccin[@@flavor][@overlay1]; | |
| @overlay0: @catppuccin[@@flavor][@overlay0]; | |
| @surface2: @catppuccin[@@flavor][@surface2]; | |
| @surface1: @catppuccin[@@flavor][@surface1]; | |
| @surface0: @catppuccin[@@flavor][@surface0]; | |
| @base: @catppuccin[@@flavor][@base]; | |
| @mantle: @catppuccin[@@flavor][@mantle]; | |
| @crust: @catppuccin[@@flavor][@crust]; | |
| @accent: @catppuccin[@@flavor][@@accentColor]; | |
| @rosewater-filter: @catppuccin-filters[@@flavor][@rosewater]; | |
| @flamingo-filter: @catppuccin-filters[@@flavor][@flamingo]; | |
| @pink-filter: @catppuccin-filters[@@flavor][@pink]; | |
| @mauve-filter: @catppuccin-filters[@@flavor][@mauve]; | |
| @red-filter: @catppuccin-filters[@@flavor][@red]; | |
| @maroon-filter: @catppuccin-filters[@@flavor][@maroon]; | |
| @peach-filter: @catppuccin-filters[@@flavor][@peach]; | |
| @yellow-filter: @catppuccin-filters[@@flavor][@yellow]; | |
| @green-filter: @catppuccin-filters[@@flavor][@green]; | |
| @teal-filter: @catppuccin-filters[@@flavor][@teal]; | |
| @sky-filter: @catppuccin-filters[@@flavor][@sky]; | |
| @sapphire-filter: @catppuccin-filters[@@flavor][@sapphire]; | |
| @blue-filter: @catppuccin-filters[@@flavor][@blue]; | |
| @lavender-filter: @catppuccin-filters[@@flavor][@lavender]; | |
| @text-filter: @catppuccin-filters[@@flavor][@text]; | |
| @subtext1-filter: @catppuccin-filters[@@flavor][@subtext1]; | |
| @subtext0-filter: @catppuccin-filters[@@flavor][@subtext0]; | |
| @overlay2-filter: @catppuccin-filters[@@flavor][@overlay2]; | |
| @overlay1-filter: @catppuccin-filters[@@flavor][@overlay1]; | |
| @overlay0-filter: @catppuccin-filters[@@flavor][@overlay0]; | |
| @surface2-filter: @catppuccin-filters[@@flavor][@surface2]; | |
| @surface1-filter: @catppuccin-filters[@@flavor][@surface1]; | |
| @surface0-filter: @catppuccin-filters[@@flavor][@surface0]; | |
| @base-filter: @catppuccin-filters[@@flavor][@base]; | |
| @mantle-filter: @catppuccin-filters[@@flavor][@mantle]; | |
| @crust-filter: @catppuccin-filters[@@flavor][@crust]; | |
| @accent-filter: @catppuccin-filters[@@flavor][@@accentColor]; | |
| } | |
| .defaults() { | |
| color-scheme: if(@flavor = latte, light, dark); | |
| ::selection { | |
| background-color: fade(@accent, 30%); | |
| } | |
| input, | |
| textarea { | |
| &::placeholder { | |
| color: @subtext0 !important; | |
| } | |
| } | |
| } | |
| .rgbify(@color) { | |
| @rgb: red(@color), green(@color), blue(@color); | |
| } | |
| .hslify(@color) { | |
| @raw: e( | |
| %("%s, %s%, %s%", hue(@color), saturation(@color), lightness(@color)) | |
| ); | |
| } | |
| .css-variables() { | |
| --ctp-rosewater: @rosewater; | |
| --ctp-flamingo: @flamingo; | |
| --ctp-pink: @pink; | |
| --ctp-mauve: @mauve; | |
| --ctp-red: @red; | |
| --ctp-maroon: @maroon; | |
| --ctp-peach: @peach; | |
| --ctp-yellow: @yellow; | |
| --ctp-green: @green; | |
| --ctp-teal: @teal; | |
| --ctp-sky: @sky; | |
| --ctp-sapphire: @sapphire; | |
| --ctp-blue: @blue; | |
| --ctp-lavender: @lavender; | |
| --ctp-text: @text; | |
| --ctp-subtext1: @subtext1; | |
| --ctp-subtext0: @subtext0; | |
| --ctp-overlay2: @overlay2; | |
| --ctp-overlay1: @overlay1; | |
| --ctp-overlay0: @overlay0; | |
| --ctp-surface2: @surface2; | |
| --ctp-surface1: @surface1; | |
| --ctp-surface0: @surface0; | |
| --ctp-base: @base; | |
| --ctp-mantle: @mantle; | |
| --ctp-crust: @crust; | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment