Appearance

Light and dark, nineteen colour themes, fifteen Surfaces, UI text size, and the first-run setup

Everything about how Foxl looks lives in one place: Settings > Appearance. The choices apply to the desktop app, app.foxl.ai and the phone apps, and they are per device.

Light, dark, or system

Foxl follows your system setting by default. Pin it to Light or Dark to stop it following.

In the light theme the sidebar and the frame around a conversation are white, with one thin line between the sidebar and the conversation, and the selected chat still stands out. In the desktop app and in Chrome and Edge, the bar at the top of a conversation, a page or Settings shows a line under it only while the content is scrolled up beneath it.

Every option below composes with this switch rather than replacing it - each palette and each Surface has its own light and dark rendering.

Colour themes

Nineteen palettes, starting with Foxl (the original look) and eighteen others:

EmeraldMonokaiSolarized
AmberDraculaNord
Rose PineCatppuccinTokyo Night
GruvboxIceAMOLED
KiroIntelliJHigh Contrast
EverforestAMOLED MidnightAMOLED Grey Calm

Settings > Appearance in Foxl: Theme with Light, Dark and System, the nineteen colour themes as a grid with Foxl selected, and the Surface washes below.

The same Foxl window in Dark with the Tokyo Night colour theme: a chat that read a cost export and answered with a table.

Each is a full palette - the canvas, the cards, the text and the accent - not an accent colour on top of the default. Every tile in the picker paints that theme's real colours, so you are choosing by what it looks like rather than by name.

All 396 text-on-surface pairings across the set were measured to clear the WCAG AA contrast floor. Not choosing a theme leaves Foxl looking exactly as it always has - Foxl sits first in the picker and is the default.

The palette names are deliberately not translated. Dracula, Nord, Monokai and the rest are proper nouns and are known by those names everywhere, so a theme someone recommends to you is recognisable whatever language your app is in. High Contrast is the exception, because it describes what it does rather than naming a thing.

Surfaces

A Surface puts a soft vertical gradient on the app's chrome - the sidebar, the outer canvas and the window titlebar. The content area is never tinted.

Default is flat, as Foxl has always been, and is what you get if you never open this row. Beyond it there are fourteen gradients in three groups, so the picker stays legible instead of being one row of colour soup:

GroupWhat is in itPresets
WashesLow-saturation two-stop washes - the character the feature shipped with.Default, Dawn, Mist, Sand, Sage
ColorsOne hue each, for when you want a colour rather than a mood.Blue, Violet, Pink, Coral, Crimson, Green
SpectrumRamps with more than two stops.Rainbow, Trans, Sunset, Aurora

Each is shown as a real swatch rather than a name, and each tile paints its own preset in both light and dark mode - so picking Dawn does not make the Mist tile look like Dawn.

Text stays exactly as legible as it is on the flat surface. A gradient can only be darker than the surface it replaces, so the sidebar's labels are re-derived to hold their contrast over the deepest point of each ramp, measured in both themes rather than eyeballed.

Text size, motion and the cursor

SettingWhat it does
UI text sizeScales every size expressed in rem, so text and the controls around it grow together - menus, tool rows, the code in a reply, the model picker, sidebar labels and badges included. Six steps from 0.85x to 1.3x; the range is clamped so Settings itself can never become unreadable. The phone tab bar's captions and the product name at the top of the sidebar keep their size, so a larger setting does not cut them off.
Reduce motionCollapses transitions and animations. Your system setting is already respected on its own; this is in addition to it.
Use pointer cursorsShows a hand cursor over buttons and menu items, the way a web page does. Off follows the platform's own convention (the standard arrow cursor on Linux).
Channel listHow densely the Channels list packs its rows. Shown only on an account that includes a Foxl workspace.

On iPhone and iPad, text also follows Settings > Display & Brightness > Text Size - see Mobile Apps.

In the chat

What sits around a conversation (the plan checklist, the Files changed card) and which key sends a message are chat settings, so they are in Settings > Chat with the others - see Chat settings.

The first-run setup

A new install opens on a short setup drawn over the live app:

  1. Pick your look - light, dark or system, and one of the palettes. The palette applies as you tap it, so you are choosing against the real app rather than a preview. On Windows this screen and the next also have Start Foxl when I sign in, on unless you turn it off.
  2. Tell Foxl about you (optional) - your role, and how technical you are, as three cards: full technical detail, concepts rather than internals, or plain language.
  3. Set up Foxl Notes (desktop app only) - one screen of optional rows: on a Mac with Apple Silicon, Run Notes on this Mac (Run Notes on this computer on a Windows PC or a Linux x64 computer: the on-device speech engine and Gemma, about 6.5 GB, or Ready when the computer can already transcribe and summarize), and elsewhere an AssemblyAI key for transcription; allow the microphone and audio from other apps; and Live translation. The side panel says what runs on your computer, what goes online and how much is downloaded. A calendar is connected later, in Settings > Notes > Calendar (see Calendar).
  4. Bring your setup - only when the computer has a Claude Code or Codex setup with something Foxl does not have yet: the same list as Settings > Advanced > Import and export (see Skills), with everything new ticked.
  5. Connect a model - only on a computer where nothing can answer a chat yet; a computer that can already chat skips it.
  6. A short tour, one card at a time, each pointing at the control it is about: Schedules, Agents, Chat, in the macOS and Linux app the green dot in the title bar (it opens the status panel: what is running, the tokens and cost of the chat, and what is left on your plan or credits), and on the desktop app the Model & provider pane, because a fresh desktop cannot chat until a provider is connected. app.foxl.ai gets the first three.

The first time you open Settings in the desktop app, a second short tour points at what is easy to miss there: the browser extension under Web Access, Computer use (on a Mac), Dictate anywhere, and last Settings > Notes > Calendar, where one Connect shows today's meetings in Notes.

Nothing is required. Continue works with nothing selected, and Skip all or Escape leaves at any point. An install you have already used is never shown it.

To see it again, use the Show setup again button in Settings > Appearance.

Setup is remembered for your account: once a signed-in device finishes or skips it, the other devices you sign in to skip it too. A desktop app that is not signed in yet cannot know whose account it is, so its first launch still shows its own setup.

Below it, Reset onboarding returns you to the main screen, where setup starts over. Signed in, it resets setup for your account: it runs once more, on this device straight away or on whichever of your devices you open first, and finishing or skipping it on any of them completes it on all of them. It is a different action from Show setup again: it is also the way back to Foxl Code's setup page, and it exists on the phone apps too.

The setup screens are a desktop app and browser thing. The iPhone and Android apps go straight from sign-in into the product, because everything the setup offers is one tap away under Settings on a screen you chose to open. They show it only when you ask: Show setup again, or a Reset onboarding on any of your devices.

The status HUD in the titlebar

Clicking the HUD opens a panel with tokens in and out, how much of the prompt was cached, estimated cost, context used, which MCP servers are connected and which tools have been called. That stays the default.

A switch in the corner of that panel moves those readouts into the bar itself, as one segmented pill that updates live while an agent works - so watching a long run no longer means holding a dropdown open.

  • The status dot at its left folds the readouts away, and brings them back when the window gets tight.
  • The chevron beside them opens the full panel exactly as before, so nothing becomes unreachable in either shape.
  • CPU, memory and disk are deliberately not there: those describe the machine rather than the run.

The This chat panel also carries a Delegated line when the chat spawned sub-agents - their tokens and how many workers produced them - while the context bar keeps to the chat's own fill. The token and cost figures are computed the same way whichever model answered.

Search owns the titlebar centre by default; the HUD is the alternative, with Settings > General > Status HUD in titlebar. Turning it off never hides the connection status, which sits beside the notification bell either way. The titlebar is drawn by Foxl on macOS and Linux; Windows uses its own title bar.

Hover and highlight

On a pointer device, hovering a sidebar row - a nav row, a conversation or a recording - swells its rounded chip very slightly as the highlight fills in, so the row under the cursor reads as the one you are about to click. It runs on the app's standard motion timing, so Reduce motion collapses it. Touch screens are left out: there is no hover to end on a phone, so a tapped row would stay enlarged.

  • Install Foxl - the translucent window material on macOS 26 and later.
  • The desktop companion - the animal that can walk around your screen, in Settings > Pet.
  • Settings > Shortcuts - a searchable list of every command with its chord: click a row to record a new one, conflicts are marked on the rows involved, and each row (or all of them) can be reset. Rows that belong to the editor, the terminal and the file tree are fixed and offer no recorder. Labels follow the platform (Cmd on a Mac, Ctrl elsewhere).
  • Settings > Tab bar (phones and tablets only, not a computer) - which destinations sit in the bottom bar and in what order; see Mobile Apps.

On this page