Themes API

Use the themes API for tree-shaking and dynamic imports.

Import

import { loadTheme, themes } from 'ospinajuanp-reset-css/themes';

Functions

Name	Type	Default	Description
loadTheme	(themeName: ThemeName) => Promise<void>	-	Dynamically load and apply a theme. Only loads the CSS for that specific theme.
themes	ThemeName[]	-	Array of all available theme names.

Usage Example

// Dynamic import - only loads the theme CSS used
const { loadTheme, themes } = await import('ospinajuanp-reset-css/themes');

await loadTheme('dark'); // Loads only resetStyleDark.css

Available Themes

Simple (Default)

Baseline reset with minimal styling.

Dark Mode

Dark theme optimized for low-light environments.

Pastel

Soft pastel colors for a gentle visual experience.

Dark Blue Pastel

Dark theme with blue pastel accents.

Light Blue Pastel

Light theme with blue pastel accents.

Retro

Nostalgic retro-style theme.

Tree-shaking

Webpack, Vite, and Next.js can automatically tree-shake unused CSS. Use dynamic imports to load only the theme you need:

// This approach ensures only the CSS for the selected theme is bundled,
// reducing your final bundle size.