arc
Themes
Customize the entire appearance of the application and 3D viewport. Built-in presets ship with the app; user themes are lightweight JSON files that can be imported, exported, and shared.
Built-in Themes
Built-in themes can be selected in Settings → Appearance:
| Theme | Appearance |
|---|---|
| Deep Graphite | Neutral dark graphite panels (#12141a) with viewport (#161922) and electric cyan accent (#00e8ff). Default theme. |
| Glass | Deep dark obsidian panels (#161619) with viewport (#1c1c22) and vivid blue accent (#0099ff). |
Color Tokens
A theme defines exactly sixteen color tokens:
| Token | Usage |
|---|---|
| base-50 | Deepest window and background surface. |
| base-100 | Base panels, tool docks, and dialogs. |
| base-150 | Slightly raised surfaces and input backgrounds. |
| base-200 | Hover fills and secondary controls. |
| base-300 | Pressed states and deep active fills. |
| base-400 | Subtle divider lines and borders. |
| base-500 | Faint text and placeholder labels. |
| base-600 | Secondary muted text. |
| base-700 | Standard body text. |
| base-800 | Primary bright text and headings. |
| accent-500 | Bright accent highlights (active tool pill, view cube hover). |
| accent-600 | Primary action buttons and selection outlines. |
| accent-700 | Deeper accent states. |
| viewport-bg | 3D WebGL viewport canvas background. |
| viewport-grid | Primary drafting grid lines. |
| viewport-grid-line | Secondary subdivision grid lines. |
Theme JSON Format
Custom themes are structured JSON documents containing a theme name and a colors dictionary:
{
"name": "Cyber Blue",
"colors": {
"base-50": "#0b0d13",
"base-100": "#11151f",
"accent-500": "#38bdf8",
"viewport-bg": "#0d111a"
}
}Theme parsing rules:
- Forgiving structure: You can provide colors directly at the top level alongside name.
- Shorthand aliases: accent maps to accent-500; background, bg, viewport, and canvas map to viewport-bg; grid maps to viewport-grid.
- Fallback defaults: Any unspecified color token falls back to the Deep Graphite default.
Import & Export
In Settings → Appearance, click Import Theme to load any JSON theme file. The theme applies instantly. You can also export active themes to share them with other users.