# flask.do

Source: https://flask.do/
Captured: 2026-10-28
Tags: saas, landing, dark, both, minimal, dark-techno, premium, technical, calm, futuristic, confident
Colors: #0e0e0e, #45838c, #2d2d2d, #454f52, #919192, #acacac, #6f7070, #dfb3b1
Type (h1): ui-sans-serif · 64px/69.12px · 500 · tracking -1.6px — "Video review and collaboration for teams and their agents"
Type (h2): ui-sans-serif · 44px/48.4px · 500 · tracking -1.1px — "Talk, Draw, Show"
Type (h3): ui-sans-serif · 12px/16px · 500 · tracking 0.6px — "PRODUCT"
Type (body): ui-sans-serif · 16px/23.2px · 400 · tracking -0.16px — "Record, draw or type your feedback to easily complex feedback across. Agents can"
Type (small): ui-sans-serif · 13px/19.5px · 500 — "Sign Up"
Type (button): ui-sans-serif · 13px/19.5px · 500 — "Sign Up"
Button: "Sign UpOpen" — text #fafafa, radius 9999px, border 0px, padding 0px 14px, height 32px, type 13px/500
Radii: 9999px (27), 16px (7), 10px (7), 13px (7), 12px (4)

## Images

- Hero (desktop): https://media.lvly.design/library/flask-do/hero.webp?v=1ec7523c
- Page crop (mid-1): https://media.lvly.design/library/flask-do/mid-1.webp?v=13d79669
- Page crop (mid-2): https://media.lvly.design/library/flask-do/mid-2.webp?v=56e93879
- Hero (mobile): https://media.lvly.design/library/flask-do/mobile-hero.webp?v=73b64634
- Full page (desktop): https://media.lvly.design/library/flask-do/full.jpg?v=dc4a7565
- Full page (mobile): https://media.lvly.design/library/flask-do/mobile-full.jpg?v=90fbb30c
- Clip preview (mp4): https://media.lvly.design/library/flask-do/video-hbjzru.preview.mp4?v=6d606e34

A near-black (#0e0e0e) video-review landing page that lets the product carry nearly all the color. The chrome is strictly monochrome: system sans (ui-sans-serif) at weight 500 with tight negative tracking, gray body copy, hairline-bordered pills and smoky charcoal panels. Color only enters through the content: the teal-and-pink film still inside the app mock, and the small colored cursors of people and AI agents perched on the headline. The hero is unusually patient, with roughly 400px of empty black above a centered two-line H1, and a faint dot-matrix field fades in behind the headline and the product frame. Lower down, sections alternate between a left-aligned headline beside a live UI fragment and full-width app screenshots: permission popovers, a side-by-side version compare, an agent chat log and a radial integrations hub. Each is rendered as real interface rather than illustration. The overall effect is a calm, expensive tool for creative professionals that treats agents as first-class collaborators.

## Steal-worthy details

- Multiplayer cursors as headline decoration: four arrow cursors with avatar chips (two humans, the ChatGPT and Claude marks) sit on the H1's letterforms in blue, purple and coral, so the "teams and agents" pitch shows up before anyone reads the subhead
- A serif-italic wordmark ("flask", Clarendon-like) in an otherwise all-sans system. It is the only typographic warmth on the page and is repeated as the product's own logo inside every mock
- Ghost pill nav CTA: 32px tall, 9999px radius, 13px/500 #fafafa text, no fill, only a 1px #2d2d2d hairline, so it barely outranks the 13px gray text links beside it
- A dot-matrix halftone field (about 1px dots on a 12px pitch, #2d2d2d) that fades in from the edges below the headline and sits behind the product frame, giving texture without a gradient
- The hero product mock is a full app window (breadcrumbs, version chip "v2", a feedback thread with timestamp pills) in a 16px-radius frame with a #2d2d2d hairline, bleeding off the fold so scrolling feels like entering the app
- Version compare shown as two thumbnails tagged "v3" / "v2" in tiny dark pills, above stacked scrubbers with monospace 0:00 timecodes, a compact way to sell versioning
- Agent work rendered as a chat log of checkmarked steps ("Uploading v3 and its source to Flask") beside the timeline. The agent's output is proof of capability, not a marketing claim
- Integrations hub: the wordmark in a dark rounded tile at the center, with app icons (Notion, Claude, OpenAI, Blender, DaVinci) on a faint ring of curved hairlines over the dot field. Only the partner icons carry color
- A skeuomorphic feedback composer (chrome mic, screen-record and pencil glyphs in a dark capsule) recurs as the final CTA's eyebrow, so the closing "You know what to do.." is literally the product's input

## Style recipe

Build on a near-black ground (#0c0c0c to #0e0e0e) with no gradients. Use charcoal surfaces (#161616 to #1a1a1a), #2d2d2d hairlines and grays #6f7070 / #919192 / #acacac for secondary text; primary text is #fafafa. Keep the UI chrome fully monochrome and let color come only from content (photography, video frames, partner logos), plus at most one muted brand hue such as teal #45838c or a dusty rose #dfb3b1 used sparingly. Set everything in the system sans (ui-sans-serif / SF) at weight 500 for headings: H1 64px/1.08 with -1.6px tracking, H2 44px/1.1 with -1.1px tracking. Use 12px uppercase eyebrows at +0.6px tracking, 16px/1.45 body at -0.16px in gray, and 13px/500 for controls. Give the logo alone a serif italic for contrast. Buttons are pills (9999px radius, 32px tall, 14px horizontal padding): the default is ghost with a 1px #2d2d2d hairline. A primary can be a soft light-gray pill with a subtle top highlight and drop shadow, like a physical key. Cards and app frames use 10–16px radii with hairline borders and no visible shadows. Add texture with a faint dot-matrix field (about 1px #2d2d2d dots on a 12px grid) that fades at its edges. Show the product as real, high-fidelity UI fragments (popovers, scrubbers, chat logs, tiny version chips) rather than illustrations, and use monospace for timecodes and counts. Be generous with vertical space (300–400px of empty black between beats), alternate a left-aligned headline beside a UI fragment with full-width screenshots, and keep the nav a chromeless strip: wordmark left, 13px gray links and one ghost pill right.
