# fountible.com

Source: https://fountible.com/
Captured: 2026-10-26
Tags: saas, landing, light, both, minimal, bento, swiss, technical, confident, futuristic, calm
Colors: #f7f7f7, #d3d2d4, #181719, #b0b1b3, #707071, #322c2e, #4f4f50, #8f8f90
Type (h1): Duplet · 64px/64px · 600 · tracking -1.28px — "Design tool of the AI era."
Type (h2): Duplet · 50px/60px · 420 · tracking -0.75px — "They gave us design tools. Then they blocked us with handoffs. They gave us agen"
Type (h3): Duplet · 34px/32.3px · 600 · tracking -1.53px — "A quiet landmark in full colour."
Type (body): Manrope Variable · 17px/25.5px · 420 — "Describe it and Bro designs it on your canvas: screens, motion, slides. Edit any"
Type (small): Manrope Variable · 12px/18px · 600 — "New"
Type (button): Manrope Variable · 13px/19.5px · 600 — "Start free"
Button: "Start free" — fill #f05023, text #ffffff, radius 9999px, border 0px, padding 0px 18px, height 36px, type 13px/600
Radii: 6px (37), 9999px (17), 8px (11), 12px (10), 16px (4)

## Images

- Hero (desktop): https://media.lvly.design/library/fountible-com/hero.webp?v=a6dc151b
- Page crop (mid-1): https://media.lvly.design/library/fountible-com/mid-1.webp?v=aa08bfef
- Page crop (mid-2): https://media.lvly.design/library/fountible-com/mid-2.webp?v=995091e8
- Hero (mobile): https://media.lvly.design/library/fountible-com/mobile-hero.webp?v=e658b896
- Full page (desktop): https://media.lvly.design/library/fountible-com/full.jpg?v=5847e1f4
- Full page (mobile): https://media.lvly.design/library/fountible-com/mobile-full.jpg?v=cc4d4915
- Clip preview (mp4): https://media.lvly.design/library/fountible-com/video-ate9zb.preview.mp4?v=d57670a1

A near-white (#f7f7f7) tool landing page that reads like a blueprint: a hairline frame runs down both sides of the page, with tiny circle nodes where the horizontal section rules cross the frame, and every section and card carries a monospaced index ("04 Canvas", "07.3 Shaders"). Display type is Duplet at 600 with tight tracking (64/64, -1.28px). A single vermilion (#f05023) appears only on the primary CTA, the "Bro" mark and in-canvas selection outlines. That restraint lets the product's dark, near-black (#181719) inspector panels carry the visual weight. The hero is an isometric, exploded stack of the canvas tilted in 3D, with a mono spec list beneath it in place of a feature grid.

## Steal-worthy details

- Blueprint page frame: 1px vertical rails at the content edges, with small hollow circle nodes where each horizontal section rule meets a rail, so the whole page reads as a technical drawing
- Isometric exploded hero: the product canvas tilted about 30° in 3D and stacked over ghosted outline copies of itself, with mono "VIDEO MODE · 60 FPS" labels printed on the slab
- A mono spec ledger in place of feature cards: numbered rows ("01 Build with Bro … your ChatGPT or Claude plan") with the label on the left, the value right-aligned and hairline dividers between rows
- Two-tone h2: the first line in mid-gray (#707071), the second in near-black ink, so one headline holds both the setup and the punchline
- Every section and card is indexed in small monospaced type (04, 04.1, 07.3), plus an uppercase mono eyebrow in a white pill with a square vermilion bullet
- Feature cards are light gray dotted-grid wells with a 16px radius, each holding a real dark product panel (#181719, 8–12px radius) that overlaps the artwork. The demo sits in the card, not a screenshot of it
- A floating pill nav that sits inset from the viewport edges, in white with a soft shadow, a vermilion 36px "Start free" pill on the right and a mono-icon "Inspect" toggle
- Paired CTAs: a vermilion pill with an arrow beside a black pill with an Apple glyph and an inner top highlight, followed by one line of 13px gray reassurance copy
- A "Used by teams at" logo strip set in its own hairline-ruled band, with the label in lowercase mono on the left and grayscale logos aligned right
- A page-wide brand wordmark cropped at the bottom of the footer, set in pale gray

## Style recipe

Build on a #f7f7f7 canvas with near-black ink #181719 and a gray ramp (#4f4f50 body emphasis, #707071 secondary, #b0b1b3 and #d3d2d4 for rules and outlines). Use exactly one accent, vermilion #f05023, and keep it to primary CTAs, selection outlines and tiny bullets. Never use it for a section fill. Display type is a geometric grotesk like Duplet at weight 600 with negative tracking: 64/64 at -0.02em for the h1, 34px at -0.045em for card titles, and h2s at weight 420 and 50/60, where the first line is gray #707071 and the second is ink. Body is Manrope at weight 420, 17/25.5. All labels, indexes and spec values use a monospace at 11–13px, in sentence case or as uppercase eyebrows with about 0.08em tracking. Frame the layout with 1px vertical rails at the content edges and horizontal section rules, and put a small hollow circle node at every junction. Number every section and card in mono (04, 04.1). Cards are #efefef-ish wells with a faint dotted grid, a 16px radius and no shadow, holding dark product panels (#181719, 8–12px radius, 6px inputs) that overflow the composition. Buttons are 36–44px pills (9999px radius) at 13–15px and weight 600: a vermilion fill with white text and a trailing arrow, or a black fill with a 1px inner top highlight. Secondary buttons are white pills with a hairline border. Navigation is a white pill floating 12px in from the viewport, with a soft, wide, low-opacity shadow. Hero art should be an isometric or tilted 3D product object with ghost outline copies, never a flat screenshot. Favor spec ledgers (label left, value right, hairline dividers) over icon grids.