Color Theme

Deca provides a complete color customization system with support for brand colors and dark mode.

Inspired by the Docusaurus styling system, Deca follows the same variable naming conventions and architecture, enabling users to create color themes that meet WCAG-AA accessibility standards.

Customization Method

Create a file at assets/sass/_custom.scss and paste in the color system generated by the Docusaurus Theme Generator. Your configuration should look like this:

:root {
    --ifm-color-primary: #2e8555;
    --ifm-color-primary-dark: #29784c;
    --ifm-color-primary-darker: #277148;
    /* ... */
}

html.dark {
    --ifm-color-primary: #25c2a0;
    --ifm-color-primary-dark: #21af90;
    --ifm-color-primary-darker: #1fa588;
    /* ... */
}