Appearance
In the Appearance tab you adjust all colors of your wiki - separately for light mode and dark mode.
Switch Light/Dark Mode
Section titled “Switch Light/Dark Mode”At the top of the tab you’ll find a toggle to switch between light mode and dark mode. Depending on your selection, you’ll edit the colors for the corresponding mode.
| Mode | Description |
|---|---|
| Light Mode is being edited | You’re editing colors for light mode |
| Dark Mode is being edited | You’re editing colors for dark mode |
Tap the toggle to switch between modes.
Background
Section titled “Background”Colors for background and cards.
Background Color
Section titled “Background Color”What it does: The main color of the wiki background.
How to find it: Appearance > Background > Background Color
Default (Light): Light gray (#F5F5F5) Default (Dark): Dark gray (from theme)
Tap the color to open the color picker. Use the reset button to return to the default app theme color.
Card Color
Section titled “Card Color”What it does: The background color of article cards.
How to find it: Appearance > Background > Card Color
Default (Light): White (#FFFFFF) Default (Dark): Dark surface (from theme)
Text Colors
Section titled “Text Colors”Colors for different text areas.
Title Color
Section titled “Title Color”What it does: The color for article titles.
How to find it: Appearance > Text Colors > Title Color
Default (Light): Dark gray (#212121) Default (Dark): Light gray (from theme)
Content Color
Section titled “Content Color”What it does: The color for body text in articles and preview texts.
How to find it: Appearance > Text Colors > Content Color
Default (Light): Medium gray (#616161) Default (Dark): Lighter gray (from theme)
Table of Contents Color
Section titled “Table of Contents Color”What it does: The color for the automatically generated table of contents in articles.
How to find it: Appearance > Text Colors > Table of Contents Color
Default (Light): Primary color (from theme) Default (Dark): Primary color (from theme)
UI Elements
Section titled “UI Elements”Colors for interactive elements and accents.
Category Color
Section titled “Category Color”What it does: The color for category headers and category badges.
How to find it: Appearance > UI Elements > Category Color
Default (Light): Blue (#1976D2) Default (Dark): Lighter blue (from theme)
Tag Color
Section titled “Tag Color”What it does: The color for tag badges on articles.
How to find it: Appearance > UI Elements > Tag Color
Default (Light): Purple (#7E57C2) Default (Dark): Lighter purple (from theme)
Accent Color
Section titled “Accent Color”What it does: The color for links, icons and other accent elements.
How to find it: Appearance > UI Elements > Accent Color
Default (Light): Blue (#1976D2) Default (Dark): Lighter blue (from theme)
Divider Color
Section titled “Divider Color”What it does: The color for dividing lines between sections and elements.
How to find it: Appearance > UI Elements > Divider Color
Default (Light): Light gray (#E0E0E0) Default (Dark): Dark gray (from theme)
Reset Color
Section titled “Reset Color”Each color setting has a reset button. When you tap it, the color is reset to the app theme default value.
This is useful when:
- You accidentally changed a color
- You want a color to automatically follow the app theme
- You want to restore the default harmony
Apply App Theme
Section titled “Apply App Theme”You can apply all colors at once from the app theme:
- Tap the palette icon in the top right
- Confirm in the “Apply App Theme?” dialog
- All colors are applied from the global theme
This applies:
- Background and surface colors
- Text and secondary colors
- Primary color for categories and accents
- Secondary color for tags
- Corner radius from the theme
All Colors at a Glance
Section titled “All Colors at a Glance”Light Mode Default Values
Section titled “Light Mode Default Values”| Color | Value | Usage |
|---|---|---|
| Background | #F5F5F5 | Main background |
| Cards | #FFFFFF | Article cards |
| Title | #212121 | Headings |
| Content | #616161 | Body text |
| Category | #1976D2 | Category labels |
| Tags | #7E57C2 | Tag badges |
| Accent | #1976D2 | Links, icons |
| Divider | #E0E0E0 | Dividers |
Dark Mode
Section titled “Dark Mode”In dark mode, colors are automatically taken from the app theme if no custom values are set. However, you can set a custom dark mode value for each color.
Frequently Asked Questions
Section titled “Frequently Asked Questions”Do I have to configure both modes?
Section titled “Do I have to configure both modes?”Not necessarily. If you don’t set dark mode colors, the app theme colors are used automatically. But for optimal results you should test both modes.
How do I reset a single color?
Section titled “How do I reset a single color?”Each color has a reset button. Tap it to reset the color to the app theme default.
Why do my colors look different than expected?
Section titled “Why do my colors look different than expected?”- Check if you’re in the right mode (Light/Dark toggle at top)
- Check if the color was overwritten by the app theme
- Test the colors in the actual wiki, not just in the editor
Can I use transparency?
Section titled “Can I use transparency?”Yes, the color picker also supports transparent colors (alpha value). This can be useful for subtle dividers or overlay effects.