Appearance settings
Personalise the look of Flero for yourself.
📸 Screenshot needed:
settings__appearance-light-dark.png, Appearance tab split into two preview panes side by side, the left showing the editor in light theme, the right showing the same editor in dark theme, with a "Theme: System" radio selected at top.
Theme
| Choice | What it does |
|---|---|
| Light | Always light. |
| Dark | Always dark. |
| System (default) | Follows your OS setting (prefers-color-scheme). |
Changes take effect immediately.
Font size
| Choice | Effect |
|---|---|
| Small | 13 px base |
| Medium (default) | 15 px base |
| Large | 17 px base |
Affects body text, table rows, inspector labels. Doesn't affect node labels on the canvas (those scale with canvas zoom).
Accent colour
A picker with eight preset hues and a custom-hex option. Affects:
- Primary buttons.
- Selected-node outline on the canvas.
- Active sidebar item.
- Status badges.
Default is Flero blue.
Density
| Choice | Effect |
|---|---|
| Comfortable (default) | Looser spacing, easier scanning |
| Compact | Tighter rows; more content per screen |
Affects tables (execution history, log explorer, members) and inspector forms.
Canvas preferences
- Default zoom, what zoom level new workflows open at.
- Grid visible by default, toggle on/off.
- Snap to grid by default, toggle on/off.
- Connection style,
curved(default) orstraight.
Live preview
The bottom half of the Appearance page shows a live preview of a typical Flero screen with your current settings applied. Tweak and see results instantly.
Tips & gotchas
- Settings are per-user, per-browser. Switch to a different browser → defaults again.
- Dark theme + custom accent colour can produce poor contrast. Stick to presets unless you've checked accessibility.
- Compact density on small screens is fine; on large screens it can feel sparse, try Comfortable on a 27" display.
Related
Found something out of date? This page lives in the Flero docs content set.