Character.AI fonts and type scale
Character.AI's website sets both headings and body text in At Hauss. Body text is 14px, section headings 21px and the largest display type 36px, at weight 600. If you can't use At Hauss, ask your AI for the closest free match and keep the sizes and weights.
Character.AI color codes
| Canvas | #F4F4F5 | the page background |
|---|
| Surface | #FAFAFA | cards and raised areas |
|---|
| Text | #26272B | primary text |
|---|
| Muted | #585962 | secondary text and captions |
|---|
| Border | #D4D4DA | dividers and outlines |
|---|
| Button | #202024 | primary buttons, with #FAFAFA text |
|---|
How do I build a site that looks like Character.AI with AI?
Open the Prompt tab above, change its first line to what you are building, and paste it into Lovable, v0, Bolt, Claude Code or Cursor. For a whole project, install the Claude skill or the Cursor rule instead, so every screen keeps the style. Build something original: keep Character.AI's look, not its name, logo or copy.
More designs
Or open the full Character.AI report, or read any other site on Siteprint.
Measured from character.ai's live page as a browser renders it, at 1440px wide, with the Siteprint extension's scanner, on 25 October 2026. Siteprint is not affiliated with Character.AI; names and trademarks belong to their owners.