Riebeckite
Menu
Color mode

Theme configuration

Configure the theme with theme:

ts
theme: {
  colorMode: "system",
  articleLayout: "article",
}

You can use a raw theme configuration or a declared theme.

A theme is a presentation setting. Do not put integration-specific settings (HonoX, Vite, Cloudflare, and so on) into the Core configuration.

Diagram source
text
flowchart TD
    Config["Riebeckite Config"]
 
    Config --> Site["Site"]
    Config --> Content["Content"]
    Config --> Markdown["Markdown"]
    Config --> Theme["Theme"]
    Config --> Plugins["Plugins"]
 
    Framework["HonoX / Vite / Platform"]
    Framework --> Integration["Integration Config"]
 
    Integration -. "do not mix into Core Config" .-> Config

History

1 changesCollapseExpand
1 + ---
2 + title: Theme configuration
3 + sidebar:
4 + label: Theme configuration
5 + order: 70
6 + ---
7 +
8 + # Theme configuration
9 +
10 + Configure the theme with `theme`:
11 +
12 + ```ts
13 + theme: {
14 + colorMode: "system",
15 + articleLayout: "article",
16 + }
17 + ```
18 +
19 + You can use a raw theme configuration or a declared theme.
20 +
21 + A theme is a presentation setting. Do not put integration-specific settings (HonoX, Vite, Cloudflare, and so on) into the Core configuration.
22 +
23 + ```mermaid
24 + flowchart TD
25 + Config["Riebeckite Config"]
26 +
27 + Config --> Site["Site"]
28 + Config --> Content["Content"]
29 + Config --> Markdown["Markdown"]
30 + Config --> Theme["Theme"]
31 + Config --> Plugins["Plugins"]
32 +
33 + Framework["HonoX / Vite / Platform"]
34 + Framework --> Integration["Integration Config"]
35 +
36 + Integration -. "do not mix into Core Config" .-> Config
37 + ```
38 +