181 lines
9.6 KiB
CSS
181 lines
9.6 KiB
CSS
/*!Catppuccin Macchiato*/
|
|
/*
|
|
* ProxMorph PDM Theme: Catppuccin Macchiato
|
|
* Overrides the PWT Material Design tonal color system with Catppuccin Macchiato palette
|
|
* Version: 1.0.0
|
|
* Author: ProxMorph / Catppuccin Community Palette
|
|
*
|
|
* ─── Catppuccin Macchiato Palette ─────────────────────────────
|
|
* Mauve (accent): #c6a0f6 Blue: #8aadf4
|
|
* Green: #a6da95 Red: #ed8796
|
|
* Yellow: #eed49f Pink: #f5bde6
|
|
* Text: #cad3f5 Base: #24273a
|
|
* Surface0: #363a4f Mantle: #1e2030
|
|
* Crust: #181926
|
|
*/
|
|
|
|
/* ===== Tonal Color Overrides ===== */
|
|
:root {
|
|
/* Primary — Catppuccin Macchiato Mauve (#c6a0f6) tonal scale */
|
|
--pwt-color-primary-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-primary-99: rgb(252, 248, 255) !important;
|
|
--pwt-color-primary-95: rgb(240, 228, 254) !important;
|
|
--pwt-color-primary-90: rgb(225, 208, 250) !important;
|
|
--pwt-color-primary-80: rgb(198, 160, 246) !important;
|
|
--pwt-color-primary-70: rgb(175, 138, 225) !important;
|
|
--pwt-color-primary-60: rgb(150, 114, 200) !important;
|
|
--pwt-color-primary-50: rgb(126, 92, 178) !important;
|
|
--pwt-color-primary-40: rgb(102, 70, 152) !important;
|
|
--pwt-color-primary-30: rgb(80, 48, 128) !important;
|
|
--pwt-color-primary-20: rgb(58, 30, 102) !important;
|
|
--pwt-color-primary-15: rgb(46, 20, 85) !important;
|
|
--pwt-color-primary-10: rgb(35, 12, 68) !important;
|
|
--pwt-color-primary-5: rgb(22, 5, 46) !important;
|
|
--pwt-color-primary-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Secondary — Catppuccin Macchiato Blue (#8aadf4) tonal scale */
|
|
--pwt-color-secondary-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-secondary-99: rgb(248, 250, 255) !important;
|
|
--pwt-color-secondary-95: rgb(222, 236, 255) !important;
|
|
--pwt-color-secondary-90: rgb(198, 220, 254) !important;
|
|
--pwt-color-secondary-80: rgb(158, 192, 248) !important;
|
|
--pwt-color-secondary-70: rgb(138, 173, 244) !important;
|
|
--pwt-color-secondary-60: rgb(112, 148, 218) !important;
|
|
--pwt-color-secondary-50: rgb(88, 124, 192) !important;
|
|
--pwt-color-secondary-40: rgb(66, 100, 166) !important;
|
|
--pwt-color-secondary-30: rgb(46, 78, 138) !important;
|
|
--pwt-color-secondary-20: rgb(28, 56, 110) !important;
|
|
--pwt-color-secondary-15: rgb(20, 44, 90) !important;
|
|
--pwt-color-secondary-10: rgb(12, 32, 70) !important;
|
|
--pwt-color-secondary-5: rgb(5, 18, 46) !important;
|
|
--pwt-color-secondary-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Tertiary — Catppuccin Macchiato Pink (#f5bde6) tonal scale */
|
|
--pwt-color-tertiary-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-tertiary-99: rgb(255, 250, 253) !important;
|
|
--pwt-color-tertiary-95: rgb(255, 236, 248) !important;
|
|
--pwt-color-tertiary-90: rgb(252, 215, 242) !important;
|
|
--pwt-color-tertiary-80: rgb(245, 189, 230) !important;
|
|
--pwt-color-tertiary-70: rgb(225, 162, 208) !important;
|
|
--pwt-color-tertiary-60: rgb(200, 136, 184) !important;
|
|
--pwt-color-tertiary-50: rgb(175, 112, 160) !important;
|
|
--pwt-color-tertiary-40: rgb(150, 88, 136) !important;
|
|
--pwt-color-tertiary-30: rgb(124, 64, 112) !important;
|
|
--pwt-color-tertiary-20: rgb(98, 42, 88) !important;
|
|
--pwt-color-tertiary-15: rgb(80, 30, 72) !important;
|
|
--pwt-color-tertiary-10: rgb(62, 18, 56) !important;
|
|
--pwt-color-tertiary-5: rgb(42, 6, 36) !important;
|
|
--pwt-color-tertiary-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Success — Catppuccin Macchiato Green (#a6da95) tonal scale */
|
|
--pwt-color-success-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-success-99: rgb(248, 255, 246) !important;
|
|
--pwt-color-success-95: rgb(218, 252, 212) !important;
|
|
--pwt-color-success-90: rgb(190, 242, 182) !important;
|
|
--pwt-color-success-80: rgb(166, 218, 149) !important;
|
|
--pwt-color-success-70: rgb(142, 195, 128) !important;
|
|
--pwt-color-success-60: rgb(118, 172, 105) !important;
|
|
--pwt-color-success-50: rgb(95, 148, 82) !important;
|
|
--pwt-color-success-40: rgb(72, 125, 60) !important;
|
|
--pwt-color-success-30: rgb(52, 100, 40) !important;
|
|
--pwt-color-success-20: rgb(34, 76, 22) !important;
|
|
--pwt-color-success-15: rgb(24, 60, 14) !important;
|
|
--pwt-color-success-10: rgb(15, 45, 6) !important;
|
|
--pwt-color-success-5: rgb(6, 28, 0) !important;
|
|
--pwt-color-success-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Error — Catppuccin Macchiato Red (#ed8796) tonal scale */
|
|
--pwt-color-error-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-error-99: rgb(255, 248, 249) !important;
|
|
--pwt-color-error-95: rgb(255, 228, 232) !important;
|
|
--pwt-color-error-90: rgb(252, 205, 212) !important;
|
|
--pwt-color-error-80: rgb(245, 170, 180) !important;
|
|
--pwt-color-error-70: rgb(237, 135, 150) !important;
|
|
--pwt-color-error-60: rgb(215, 108, 125) !important;
|
|
--pwt-color-error-50: rgb(192, 85, 102) !important;
|
|
--pwt-color-error-40: rgb(168, 62, 78) !important;
|
|
--pwt-color-error-30: rgb(140, 40, 56) !important;
|
|
--pwt-color-error-20: rgb(112, 20, 36) !important;
|
|
--pwt-color-error-15: rgb(92, 10, 25) !important;
|
|
--pwt-color-error-10: rgb(70, 0, 15) !important;
|
|
--pwt-color-error-5: rgb(46, 0, 6) !important;
|
|
--pwt-color-error-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Warning — Catppuccin Macchiato Yellow (#eed49f) tonal scale */
|
|
--pwt-color-warning-100: rgb(255, 255, 255) !important;
|
|
--pwt-color-warning-99: rgb(255, 252, 248) !important;
|
|
--pwt-color-warning-95: rgb(252, 244, 222) !important;
|
|
--pwt-color-warning-90: rgb(248, 236, 195) !important;
|
|
--pwt-color-warning-80: rgb(238, 212, 159) !important;
|
|
--pwt-color-warning-70: rgb(218, 192, 132) !important;
|
|
--pwt-color-warning-60: rgb(195, 168, 106) !important;
|
|
--pwt-color-warning-50: rgb(172, 145, 82) !important;
|
|
--pwt-color-warning-40: rgb(148, 122, 60) !important;
|
|
--pwt-color-warning-30: rgb(122, 98, 40) !important;
|
|
--pwt-color-warning-20: rgb(95, 75, 22) !important;
|
|
--pwt-color-warning-15: rgb(76, 58, 12) !important;
|
|
--pwt-color-warning-10: rgb(56, 42, 4) !important;
|
|
--pwt-color-warning-5: rgb(35, 26, 0) !important;
|
|
--pwt-color-warning-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Neutral — Catppuccin Macchiato Background scale (base #24273a) */
|
|
--pwt-color-neutral-100: rgb(202, 211, 245) !important;
|
|
--pwt-color-neutral-99: rgb(195, 204, 240) !important;
|
|
--pwt-color-neutral-95: rgb(182, 192, 225) !important;
|
|
--pwt-color-neutral-90: rgb(164, 172, 205) !important;
|
|
--pwt-color-neutral-80: rgb(142, 150, 180) !important;
|
|
--pwt-color-neutral-70: rgb(120, 128, 158) !important;
|
|
--pwt-color-neutral-60: rgb(100, 106, 135) !important;
|
|
--pwt-color-neutral-50: rgb(82, 88, 112) !important;
|
|
--pwt-color-neutral-40: rgb(54, 58, 79) !important;
|
|
--pwt-color-neutral-30: rgb(36, 39, 58) !important;
|
|
--pwt-color-neutral-20: rgb(30, 32, 48) !important;
|
|
--pwt-color-neutral-15: rgb(24, 26, 38) !important;
|
|
--pwt-color-neutral-10: rgb(18, 19, 30) !important;
|
|
--pwt-color-neutral-5: rgb(12, 12, 20) !important;
|
|
--pwt-color-neutral-0: rgb(0, 0, 0) !important;
|
|
|
|
/* Neutral Alt — Catppuccin Macchiato Overlay tones */
|
|
--pwt-color-neutral-alt-100: rgb(202, 211, 245) !important;
|
|
--pwt-color-neutral-alt-99: rgb(196, 206, 242) !important;
|
|
--pwt-color-neutral-alt-95: rgb(184, 194, 228) !important;
|
|
--pwt-color-neutral-alt-90: rgb(166, 174, 208) !important;
|
|
--pwt-color-neutral-alt-80: rgb(144, 152, 184) !important;
|
|
--pwt-color-neutral-alt-70: rgb(122, 130, 160) !important;
|
|
--pwt-color-neutral-alt-60: rgb(102, 108, 138) !important;
|
|
--pwt-color-neutral-alt-50: rgb(84, 90, 115) !important;
|
|
--pwt-color-neutral-alt-40: rgb(56, 60, 82) !important;
|
|
--pwt-color-neutral-alt-30: rgb(38, 42, 62) !important;
|
|
--pwt-color-neutral-alt-20: rgb(30, 34, 50) !important;
|
|
--pwt-color-neutral-alt-15: rgb(25, 28, 40) !important;
|
|
--pwt-color-neutral-alt-10: rgb(19, 20, 32) !important;
|
|
--pwt-color-neutral-alt-5: rgb(12, 13, 22) !important;
|
|
--pwt-color-neutral-alt-0: rgb(0, 0, 0) !important;
|
|
}
|
|
--pwt-color-surface-container: var(--pwt-color-neutral-15) !important;
|
|
--pwt-color-on-surface-container: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-neutral: var(--pwt-color-neutral-15) !important;
|
|
--pwt-color-on-neutral: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-neutral-container: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-on-neutral-container: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-dark-surface: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-on-dark-surface: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-dark-surface-container: var(--pwt-color-neutral-15) !important;
|
|
--pwt-color-on-dark-surface-container: var(--pwt-color-neutral-95) !important;
|
|
--pwt-color-neutral-alt: var(--pwt-color-neutral-alt-15) !important;
|
|
--pwt-color-on-neutral-alt: var(--pwt-color-neutral-alt-80) !important;
|
|
--pwt-color-neutral-alt-container: var(--pwt-color-neutral-alt-10) !important;
|
|
--pwt-color-on-neutral-alt-container: var(--pwt-color-neutral-alt-80) !important;
|
|
--pwt-color-background: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-inverse-surface: var(--pwt-color-neutral-80) !important;
|
|
--pwt-color-on-inverse-surface: var(--pwt-color-neutral-10) !important;
|
|
--pwt-color-border: var(--pwt-color-neutral-alt-30) !important;
|
|
--pwt-color-shadow: var(--pwt-color-neutral-0) !important;
|
|
background: var(--pwt-color-neutral-10) !important;
|
|
color: var(--pwt-color-neutral-95) !important;
|
|
}
|
|
|
|
body {
|
|
background-color: var(--pwt-color-neutral-10) !important;
|
|
}
|