How do I change the colours and fonts?

Open Knowledge Base → Settings. The top of that screen has four colour pickers and a typography section. Between them they control every visible surface here.

What the four colours do

The primary colour drives buttons, links, icons and active states. The dark surface colour is the hero background, the sidebar call-to-action and code blocks. The remaining two set heading and body text on light backgrounds.

Hover states, tints, borders, shadows and the glow behind the hero are all calculated from those four. You do not set them individually unless you want to.

Text contrast is handled for you

Button and hero text is chosen automatically based on which of black or white reads better against the colour you picked. A pale brand colour gets dark text; a deep one gets light text. You can override this under Advanced if you disagree with the result.

Fonts

Pick two families from the list and they are loaded for you. If the site already loads a brand font through its theme, choose “inherit the theme’s fonts” instead — nothing extra is requested and the knowledge base simply adopts whatever the rest of the site uses.

The advanced panel

Everything below the Advanced toggle is optional. Leave a colour there empty and it stays calculated. Fill one in and it overrides the calculation for that value only.