Overview
Cashew looks like a soft, personal money notebook. Almost every surface is a pastel tint of whatever accent color the user picked, so no two installs look the same, and the only fixed colors are the ones that carry financial meaning: green for income, a muted red for expenses, blue and indigo for upcoming and overdue items. [Measured]
Three decisions define the look:
- Accent-derived surfaces. Cards, canvases and containers are computed by lightening or darkening the accent color by set amounts (for example 0.92 for the light card tint and 0.8 for the dark card tint), with a neutral fallback of white or
#242424when the Material You option is off. [Measured] - Money has fixed colors. Income
#59a849, expense#ca5a5a, upcoming#58a4c2, overdue#6577e0, warning#ca995aand a star yellow#ffd723. These do not change with the accent. [Measured] - Platform-aware surfaces. The code branches on iOS: on iOS the standard container color uses the theme's background, while elsewhere it uses the tinted container. Fonts are user-selectable from five bundled families. [Measured]
Source for this file: the public app source and the Cashew web build at cashewapp.web.app (reachable, not measured), read on 2026-10-06, plus the Android app captured on a real phone on 2026-10-07. The Android section is now measured on the device. iOS is still unseen. See Known Gaps.
Core
Colors
| Role | Light | Dark |
|---|---|---|
| Text secondary | #888888 (40 percent black with Material You) | #494949 (25 percent white with Material You) |
| Canvas container | #ebebeb | #242424 |
| Accent container (neutral) | #f7f7f7 | #161616 |
| Heavy container | #ebebeb | #444444 |
| Divider | #f0f0f0 (6 percent black with Material You) | not extracted |
| Shadow | #5a5a5a at 40 percent, light #5a5a5a at 18 percent | #bdbdbd at 41 percent |
| Income | #59a849 | same |
| Expense | #ca5a5a | same |
| Upcoming | #58a4c2 | same |
| Overdue | #6577e0 | same |
| Warning | #ca995a | same |
| Star | #ffd723 | same |
Accent tints are computed, not fixed: the light card color is the accent lightened by 0.92, and the dark card color is the accent darkened by 0.8. Battery saver mode swaps tinted surfaces for plain #f3f3f3 and flattens shadows. A text contrast setting raises secondary text to 70 percent black or 65 percent white. All [Measured].
The default accent is #1b447a, a deep navy, and dynamic color defaults to on wherever the system supports it, so on most phones that navy is never seen and the palette comes from the system instead. [Measured] This is the single most important thing to understand about the app's color: there is no fixed brand palette on Android. Every surface, every tint and every control color is generated from one seed, and the seed is whatever the system or the reader supplies.
The device capture shows what that generation produces. The phone it ran on carries a user-chosen teal seed, so the hexes below are an example of the roles and their relationships rather than values anyone else would see:
| Role in the app | Light | Dark |
|---|---|---|
| Page | #ebfafc | #031011 |
| Card and raised surface | #eefbfc | #08282c |
| Navigation bar surface | #e1f1f4 | #1c292b |
| Navigation pill indicator | #99c2c7 | #34545a |
| Selected navigation ink | #334b4f | #cde7ec |
| Unselected navigation ink | #4a6267 | #bfc8ca |
| Large screen title | #334b4f | #9eeffd |
| Section header | #006874 | |
| Filled button | #267e89 with white | |
| Text field fill | #cde7ec | |
| Sheet surface | #ebf5f7 | |
| Floating action button | #4a6267 with white | #b1cbd0 with #1c3438 |
All [Measured on a device], and all seed-derived. What carries across any seed is the structure: the page is the palest tint, cards sit one step above it, the navigation bar one step above that, and the floating action button inverts to the opposite end of the scale. The semantic colors in the table above this one (income, expense, upcoming, overdue, warning, star) are fixed in the source and do not move with the seed, so those are the only colors in the app that are reproducible.
Typography
The app bundles six families: Avenir, Inter, DM Sans, Metropolis, Roboto Condensed and Inconsolata (monospace), and lets the user choose. Which is the default was not confirmed. [Measured] Sizes and weights come from Material defaults. [Inferred]
Shape and spacing
Rounded cards and generous padding. Measured on the device: the floating action button is a 60dp square with corners of about 18dp, a bottom sheet rounds its top corners at about 20dp, a filled text field is 40dp tall, and the primary form button is 348x44dp and fully rounded. Value chips and secondary buttons are pills. [Measured on a device] Card radii on the home screen were not measured individually.
Iconography and motion
Rounded icons tinted by category color, and heavy use of animation: animated reorderable lists and sliding sheets are included as modified local packages. [Measured]
Themes
Light, dark, and system, plus Material You dynamic color, a manually picked accent, a battery saver mode and an increased text contrast setting. [Measured]
Platform: iOS
How the iOS app looks and behaves. Items come from public source files.
Back and up navigation
Expected on iOS: chevron plus previous title, swipe from the left edge.
The iOS back swipe is expected. The app bar style was not verified. [Inferred]
Primary navigation
Expected on iOS: bottom tab bar, about five items.
A custom bottom navigation bar based on a copy of the Material navigation bar. [Measured]
Main action
Expected on iOS: nav bar or bottom bar button.
A floating add button over the list. [Inferred]
Sheets, dialogs and messages
Expected on iOS: action sheets, alerts, modals.
Sliding sheets and custom popups rather than native sheets. [Measured]
Controls
Expected on iOS: Cupertino switches, pickers, segmented controls.
Custom and Material controls. The app checks for iOS to adjust some surface colors. [Measured]
Text sizing
Expected on iOS: Dynamic Type.
Text follows the system scale. [Inferred]
Touch and pointer targets
Expected on iOS: 44pt minimum.
Not verified. [Inferred]
Insets and system bars
Expected on iOS: safe areas, status bar.
Handled by the platform. [Inferred]
Icons
Expected on iOS: SF Symbols or custom.
Custom and Material icons. [Inferred]
Account and sign-in rules
Expected on iOS: equivalent login option when third-party sign-in exists (Guideline 4.8) and in-app account deletion. Note the date checked.
Optional Google sign-in is used for syncing and backup in the app. If it is offered on iOS, an equivalent login option may be required. [Inferred] Checked: 2026-10-06 against source and general knowledge only. Verify before relying on this.
Platform conformance
Expected on iOS: system components and Dynamic Type.
Low fidelity, with some iOS-specific color branches. [Measured]
Platform: Android
How the Android app looks and behaves. Values marked as measured on a device come from the running app on an Android phone at a system font scale of 0.8. Every size is given in dp, so it is independent of the screen it was read from.
One warning applies to every color in this section. The app generates its whole palette from a single seed color, and the device it was captured on is running a user-chosen seed, so the hex values here are the roles and the relationships, not reproducible brand colors. See Known Gaps.
Back and up navigation
Expected on Android: system back and gesture, up arrow in the top bar.
Nested screens carry a back arrow at the top left, drawn on the page itself rather than inside a filled bar, with the large screen title below it. [Measured on a device]
One window hosts every screen, so back unwinds the app's own screen stack rather than a stack of system windows. Traced with the back key from the theme screen: theme, then Settings, then the More tab, then the Home tab, then out to the device home screen. Back from a non-Home tab therefore returns to Home before it leaves the app. [Observed on a device]
Primary navigation
Expected on Android: navigation bar, rail on tablets.
A bottom navigation bar with four tabs, in this order: Home, Transactions, Budgets, More. [Measured on a device] The bar measures 80dp tall, runs the full width of the window to both edges, and sits on a tinted surface one step from the page. Each tab takes a quarter of the width, a 96dp pitch, and keeps its label visible whether selected or not, with the selected label in a heavier weight. [Measured on a device]
The selected tab carries the Material 3 pill indicator at 60x32dp, and the icon inside it switches to a filled form while unselected icons stay outlined. [Measured on a device]
Top-level screens open with a large screen title that scrolls away, with icon buttons for search and overflow in the corner above it. The Transactions screen adds a second level: a horizontally scrolling month strip, where the selected month is bold with a 4dp rounded underline beneath it. [Measured on a device]
Main action
Expected on Android: floating action button.
A floating action button sits above the bottom bar, but it is not the Material shape. It measures 60x60dp with corners of about 18dp, so it reads as a rounded square rather than a circle or the 16dp Material default on a 56dp box. [Measured on a device]
Its color is the inverse of the surface rather than the accent: on light it is a dark slate fill with a white glyph, and on dark it flips to a pale fill with a dark glyph. That makes the one add action the highest-contrast object on the screen in both themes. [Measured on a device]
Sheets, dialogs and messages
Expected on Android: bottom sheets, dialogs, snackbars.
Bottom sheets carry the data entry. Adding a transaction opens a full screen, and the first input then arrives as a sheet over it, with rounded top corners measured at about 20dp, filled with a pale tint of the seed color, raising the keyboard and sitting above it. [Measured on a device] The screen behind dims under a gray scrim. [Observed on a device]
The accent color picker is also a sheet, with a heading, a switch row and a grid of color circles. [Observed on a device]
Controls
Expected on Android: Material switches, pickers, chips.
Material 3 controls throughout, tinted from the seed color, which the device confirms. Switches are the Material 3 shape at 60x40dp with a filled track when on. [Measured on a device]
A setting whose value is a choice shows that value as a filled tonal pill with a caret at the end of the row, rather than opening a separate screen. [Observed on a device] Text fields are filled rather than outlined: 40dp tall, filled with a pale tint of the seed, with a placeholder and a trailing glyph and no visible outline. The primary button on a form is full width at 348x44dp, fully rounded, filled with the seed color with a white label. [Measured on a device]
Buttons that are not primary are drawn as tonal pills on the page, for example the View All Transactions control under the home chart. [Observed on a device]
Text sizing
Expected on Android: font scale.
Sizes are in sp and the app follows the system font scale. Captured at a system font scale of 1.3 against the same screen at 0.8: every label grows, and the layout grows with it rather than holding a fixed height. The account cards on the home screen go from roughly 112x75dp to roughly 169x105dp, so the card takes the larger text instead of clipping it. [Measured on a device]
The bottom bar is the exception that still holds: it stays 80dp tall at 1.3 and the four labels grow inside it without clipping or truncating. [Measured on a device]
The app also ships its own font choice, with several bundled families the reader can switch between, which is separate from the system scale. [Measured]
Touch and pointer targets
Expected on Android: 48dp minimum.
Every tap target measured at least 48dp. Navigation tabs are 96x80dp, the top bar icon buttons are 54x54dp, settings rows run from 52dp to 78dp across the full content width, and the two-column tiles on the More screen are 180x57dp. [Measured on a device] The floating action button at 60dp and the primary form button at 44dp tall sit either side of the minimum, the button being the only control measured under it. [Measured on a device]
Insets and system bars
Expected on Android: edge to edge, system bars.
The app draws edge to edge under the system bars and leaves them transparent, so the page color shows through at the top and the bottom. [Measured on a device]
Measured on an Android phone using gesture navigation: the status bar inset is 29dp, the display cutout takes the same 29dp, and the navigation bar inset is 0dp because gesture navigation draws no bar. A 32dp mandatory gesture region sits along the bottom edge. The bottom navigation bar runs all the way to the physical bottom edge and carries its own padding, so the gesture handle sits inside the bar. [Measured on a device]
Icons
Expected on Android: Material Symbols or custom.
Rounded Material-style icons, with an Icon Style setting that switches the whole set between rounded and other shapes, and a separate pack setting for the category icons. [Measured on a device] Navigation icons switch from outlined to filled on selection. Category and account markers are plain filled circles in the category color rather than glyphs. [Observed on a device]
Account and sign-in rules
Expected on Android: account deletion and data safety requirements. Note the date checked.
An account is optional. The app runs fully with no sign-in, and sign-in exists for sync only, reached from a Login entry on the More screen. [Observed on a device] No account was signed in during the capture, so the sign-in flow is unseen. Account deletion and the data safety form were not checked. [Inferred] Checked: 2026-10-06 against source only.
Some customization, including the custom accent color picker, is behind a paid tier, which presents an upgrade panel in place of the control. [Observed on a device]
Platform conformance
Expected on Android: Material 3 components and roles.
This is the closest of the three apps to stock Material 3. The navigation bar and its pill indicator, the switches, the tonal value pills, the filled text fields and the bottom sheets are all Material 3 components with Material 3 proportions, and the palette is a generated Material 3 scheme with real tonal roles rather than a flat two-color ladder. Surfaces are tinted with the seed rather than neutral, so a light page reads as a pale wash of the accent and a dark page as a near-black version of it. [Measured on a device]
Two deliberate deviations. The floating action button is a 60dp rounded square in the inverse surface color, not a 56dp accent-colored circle. And the large screen titles are set in a heavy display weight far larger than the Material headline roles, which is what gives the app its character. [Measured on a device]
Dynamic color is on by default on a phone that supports it, and the theme mode follows the system. The app also layers its own choices on top: the accent can be set by hand, and separate settings change the icon style, the progress bar style and how totals are colored. [Measured on a device]
Platform: Web
A web build of the app at cashewapp.web.app. It was reachable but not measured.
Back and up navigation
Expected on Web: browser back, breadcrumbs.
Not verified. [Inferred]
Primary navigation
Expected on Web: top nav or sidebar.
The same bottom navigation as mobile. [Inferred]
Main action
Expected on Web: page-level button.
The floating add button. [Inferred]
Sheets, dialogs and messages
Expected on Web: modals, toasts.
The same sheets and popups. [Inferred]
Controls
Expected on Web: native or custom.
Custom-drawn controls. [Inferred]
Text sizing
Expected on Web: browser zoom.
Not verified. [Inferred]
Touch and pointer targets
Expected on Web: pointer and keyboard.
Not verified. [Inferred]
Insets and system bars
Expected on Web: viewport, scrollbars.
Not verified. [Inferred]
Icons
Expected on Web: any.
The same icons. [Inferred]
Account and sign-in rules
Expected on Web: not applicable unless the product has accounts.
Optional sign-in for sync. [Inferred]
Platform conformance
Expected on Web: web norms for links and forms.
A canvas-drawn app, so it does not follow normal web conventions such as selectable text and native form controls. [Inferred]
Cross-platform consistency
Mostly identical across platforms. Some surface colors branch on iOS, and Android gets Material You dynamic color by default. [Measured]
Do's and Don'ts
Do
- Derive surfaces from the user's accent color by lightening or darkening it.
- Keep financial meanings on fixed colors: green income, red expense, blue upcoming, indigo overdue.
- Offer Material You, a manual accent, a battery saver and a higher text contrast option.
- Let users choose their font from a small set.
- Use soft shadows and pastel containers.
Don't
- Don't tint the income and expense colors by the accent.
- Don't use hard borders. Use tinted containers and light dividers.
- Don't use pure black or pure white surfaces when the accent theme is on.
Known Gaps
The theme caveat, which applies to every Android color here
- The device this was captured on is not on the app's stock palette. Dynamic color is on, which is the app's own default, but the seed is a hand-picked teal rather than the system color, so the generated palette is specific to that install. Every Android hex in this file is therefore tagged as seed-derived and is an example of a role, not a value to copy.
- The stock palette was not captured, and could not be safely. Restoring it would have meant switching the accent away from the custom color, and the custom color editor is behind the app's paid tier, so switching back might not have been possible. Changing a reader's setting that cannot be put back is not worth a color sample, so the setting was left exactly as found. The stock default accent
#1b447aand the fixed semantic colors come from the public source files instead. - What is not seed-dependent, and so is safe to rely on: every size, every layout figure, the component shapes, the surface ordering, the inset behavior, the back behavior and the font-scale behavior. Those are all measured and would be the same under any seed.
Now verified on a device
- The Android section was captured on a real Android phone on 2026-10-07 against app version 6.7.2. Navigation structure, bar and row heights, the floating action button shape, touch targets, insets, back behavior, both themes, the sheet and form controls and font-scale behavior are measured rather than inferred.
- Two earlier entries are now settled: the default accent is
#1b447aand dynamic color defaults to on, and corner radii and several component sizes are now measured rather than inferred. - The installed version is 6.7.2, not the 6.6.11 the capture was planned against, so the file is stamped to what actually ran.
Still not verified
- iOS is entirely inferred. There was no iPhone in this capture, so every iOS topic is unseen.
- The default font was not confirmed. The app bundles several families and lets the reader choose, and which one it opens on was not read from source or from the device.
- Motion was not recorded, which matters more here than elsewhere because the app leans on animation and exposes an Animations setting with several levels. Nothing in this file describes timing or easing.
- Transaction and budget detail screens were not captured. The Transactions tab was on an empty month, and no transaction was opened, created or saved, so a populated list row, a transaction detail and the category picker are all unseen.
- The paid tier was not entered, so anything behind it is unseen apart from the upgrade panel that stands in for it.
- The web build at cashewapp.web.app was not measured.
- Sign-in behavior and store policy rules were not verified.
- Contrast: the income green (
#59a849) and expense red (#ca5a5a) measure about 2.8 to 1 and 3.8 to 1 as text on the light chip background, below the 4.5 to 1 target.