№ flomoapp-com--sign-up

Flomoapp — Sign up

Soft, pastel gradients flow over clean, geometric typography, fostering a serene, tech-forward clarity.

Ecosystem Indexminimalism editorial swiss saaslight

The page uses a clean, spacious layout with a focus on visual hierarchy. Typography is clean and legible, with ample whitespace creating a sense of calm and professionalism. The color palette is muted, relying on shades of green and white. · saas landing page, productivity app, minimalist design, clean ui, developer tools, flomo app, app showcase

Hero - desktop 1440 × 900 · mobile 375

See history ↻Visit source ↗

The whole page, top to bottom - desktop & mobile

Palette

Click any value to copy. Roles are suggestions, not gospel.

Reads as: muted · cool · monochrome

SwatchHexOKLCHSuggested roleCopy

Hex#2ccc74
OKLCHoklch(74.6% 0.179 153)
RoleDominant
find sites →
Hex#176d3e
OKLCHoklch(47.3% 0.109 154)
RoleSurface
find sites →
Hex#f4dca4
OKLCHoklch(90.1% 0.077 87)
RoleInk
find sites →
Hex#747c84
OKLCHoklch(58.2% 0.016 248)
RoleAccent
find sites →
Hex#cfbe9a
OKLCHoklch(80.7% 0.052 86)
RoleDetail
find sites →

How to build one like this

Read off the live site. Treat it as reference, not a recipe.

Download .md View raw ↗

Type ramp

Role	Family	Size	Weight	Leading	Sample
h2	Barlow-Regular	16px	700	1.06	Aa Bb Cc
h3	Barlow-Regular	48px	700	1.4	Aa Bb Cc
body	Barlow-Regular	16px	400	1.4	Aa Bb Cc
button	Barlow-Regular	16px	400	1.4	Aa Bb Cc

Spacing scale

100px

Container

Max content width 1200px

Export

:root {
  --color-dominant: #2ccc74;
  --color-surface: #176d3e;
  --color-ink: #f4dca4;
  --color-accent: #747c84;
  --color-detail: #cfbe9a;
}

For your coding agent

Drop-in prompt

Paste this into Claude Code, Cursor, or any chat-based agent. Pairs the captured tokens with a short brief so the model has both the style and the goal in one block.

Build a landing page in the visual style of Flomoapp — Sign up.
Reference design system (extracted from the live site):
- Palette: #2ccc74, #176d3e, #f4dca4, #747c84, #cfbe9a
- Typefaces: Barlow-Regular
- Macrostructure: Ecosystem Index
Use the dominant colour for surfaces, the accent sparingly,
and lean on type weight + scale rather than colour for hierarchy.
Full DESIGN.md: https://inspomcp.dev/api/design/flomoapp-com--sign-up

Sites that feel similar

Same macrostructure, different voice.

Role

Family

Size

Weight

Leading

Tracking

Sample

Barlow-Regular

16px

700

1.06

Aa Bb Cc

Barlow-Regular

48px

700

1.4

Aa Bb Cc

body

Barlow-Regular

16px

400

1.4

Aa Bb Cc

button

Barlow-Regular

16px

400

1.4

Aa Bb Cc

Build a landing page in the visual style of Flomoapp — Sign up. Reference design system (extracted from the live site): - Palette: #2ccc74, #176d3e, #f4dca4, #747c84, #cfbe9a - Typefaces: Barlow-Regular - Macrostructure: Ecosystem Index Use the dominant colour for surfaces, the accent sparingly, and lean on type weight + scale rather than colour for hierarchy. Full DESIGN.md: https://inspomcp.dev/api/design/flomoapp-com--sign-up