/* ============================================================ Voxel — accent presets Apply by setting data-theme on : Or leave it off for the default lilac. Every accent, glow, gradient, button and the logo re-theme automatically because the whole site runs on --brand-* vars. ============================================================ */ /* Emerald — classic Minecraft green */ :root[data-theme="emerald"] { --brand: #4ADE88; --brand-bright: #7CEBA8; --brand-deep: #22B368; --brand-ink: #05130b; --brand-glow: rgba(74, 222, 136, 0.40); --brand-soft: rgba(74, 222, 136, 0.16); --brand-tint: rgba(74, 222, 136, 0.08); } /* Ember — warm fireside peach */ :root[data-theme="ember"] { --brand: #F2A88C; --brand-bright: #F7C7A8; --brand-deep: #D97F5E; --brand-ink: #1c0f08; --brand-glow: rgba(242, 168, 140, 0.40); --brand-soft: rgba(242, 168, 140, 0.16); --brand-tint: rgba(242, 168, 140, 0.08); } /* Mint — cool spearmint */ :root[data-theme="mint"] { --brand: #6FD8C2; --brand-bright: #9AE8D8; --brand-deep: #4AB39D; --brand-ink: #071512; --brand-glow: rgba(111, 216, 194, 0.40); --brand-soft: rgba(111, 216, 194, 0.16); --brand-tint: rgba(111, 216, 194, 0.08); } /* Sky — calm periwinkle blue */ :root[data-theme="sky"] { --brand: #8FB2FF; --brand-bright: #B5CBFF; --brand-deep: #6E8FE6; --brand-ink: #0a1020; --brand-glow: rgba(143, 178, 255, 0.40); --brand-soft: rgba(143, 178, 255, 0.16); --brand-tint: rgba(143, 178, 255, 0.08); } /* ============================================================ Demo theme switcher (the floating dots on the live demo). It is injected entirely by js/theme-demo.js — to remove it, delete that one