Open Finapp
Guide

Theme

Customizing the app appearance.

Personalize Finapp's appearance - choose colors, dark mode, and corner roundness to match your style. All settings apply instantly without a page reload.

Accessing Theme Settings

Open the theme panel from any of these locations:

  • Settings page - full theme controls
  • Login page - toolbar at the top
  • Sidebar (desktop only) - quick access panel on the left

Color Mode

Finapp supports three color modes:

  • Light - bright interface for well-lit environments
  • Dark - dark interface, easier on the eyes in low light
  • System - automatically follows your operating system preference and switches when OS dark mode toggles

Primary Color

Choose a primary accent color used for buttons, active states, links, and interactive highlights. Over 20 color palettes are available: red, orange, amber, yellow, lime, green, emerald, teal, cyan, sky, blue, indigo, violet, purple, fuchsia, pink, and rose.

You can also enable black as primary for a monochrome look.

Neutral Color

Select the neutral (gray) tone used for backgrounds, borders, and secondary text:

  • Slate - cool blue-gray
  • Gray - pure neutral gray
  • Zinc - slightly warm gray
  • Neutral - balanced gray
  • Stone - warm beige-gray

The neutral color affects cards, sidebars, input fields, and most background surfaces.

Border Radius

Adjust the border radius to change the roundness of UI elements - cards, buttons, inputs, and modals. 6 levels available, from sharp square corners to fully rounded pill shapes.

Dashboard Widgets

On the Statistics page (main dashboard), you can show or hide individual widgets. Preferences are saved independently for each tab (Summary, Expense, Income).

Available widgets:

  • Chart - bar or line chart by period. Can be hidden entirely.
  • Quick date selector - slider for navigating between periods with a swipe. Only visible when the chart is enabled.
  • Average line - horizontal line on the chart showing the mean value.
  • Wallets - wallet balance summary with a configurable number of displayed wallets.
  • Averages - historical averages over N past periods with a configurable count.
  • Category breakdown - list, round icons, or vertical bar chart. Modes can be combined.
  • Transactions - transaction list for the selected period.

See Statistics for details on each option.

Persistence

Theme settings are saved to localStorage and applied on page load before the first render - no flash of unstyled content, no extra network request required.

Next Steps

  • Settings - configure base currency, language, and other preferences