Themes

Pico is shipped with 2 consistent themes: Light & Dark.

The Light theme is used by default. The Dark theme is automatically enabled if the user has dark mode enabled prefers-color-scheme: dark

Themes can be forced on document level <html data-theme="light"> or on any HTML element <article data-theme="dark">

Light theme

<article data-theme="light">
  …
</article>

Dark theme

<article data-theme="dark">
  …
</article>