Dark & Light Mode

How It Works

HtmlForgeX uses JavaScript-based theme switching with localStorage persistence. A theme preflight script runs before the page renders to prevent flash of unstyled content (FOUC).

Theme Variants

VariantDescription
DefaultStandard Tabler theme
Dark BlackPure black background
Dark CarbonCharcoal gray background

Component Support

Most Tabler components support dark mode automatically. The theme system uses CSS custom properties for color switching.

Accessibility

The theme system includes:

  • High contrast mode — Enhanced contrast for better readability
  • Color-blind safe palette — Alternative colors for color vision deficiency