# glif.app

Source: https://glif.app/
Captured: 2026-10-30
Tags: saas, landing, mixed, both, editorial, minimal, calm, premium, confident, elegant
Colors: #f9f9f4, #2e2e2e, #d3d8d1, #79746e, #afaca6, #53514e, #101112, #92908d
Type (h1): Iowan Old Style · 72px/72px · 500 · tracking -3.6px — "One prompt. Every creative AI tool."
Type (h2): Iowan Old Style · 48px/48px · 500 · tracking -2.4px — "See how Glif works"
Type (h3): Iowan Old Style · 36px/36px · 500 · tracking -0.9px — "Turn one product brief into a finished lookbook."
Type (body): Manrope · 16px/24px · 500 — "Describe what you want to make. Glif chooses the models and does the work across"
Type (small): Manrope · 12px/16px · 500 — "00:08 · 16:9"
Type (button): Manrope · 14px/20px · 500 — "Sign up"
Button: "Sign up" — fill #151916, text #fbfaf6, radius 12.8px, border 1px, padding 0px 12px 0px 16px, height 44px, type 14px/500
Radii: 12.8px (67), 25.6px (12), 9.6px (8), 38.4px (5), 51.2px (2)

## Images

- Hero (desktop): https://media.lvly.design/library/glif-app/hero.webp?v=c5d93919
- Page crop (mid-1): https://media.lvly.design/library/glif-app/mid-1.webp?v=6f699b00
- Page crop (mid-2): https://media.lvly.design/library/glif-app/mid-2.webp?v=9990f14c
- Hero (mobile): https://media.lvly.design/library/glif-app/mobile-hero.webp?v=c2b09158
- Full page (desktop): https://media.lvly.design/library/glif-app/full.jpg?v=13b617c3
- Full page (mobile): https://media.lvly.design/library/glif-app/mobile-full.jpg?v=af2d303b
- Clip preview (mp4): https://media.lvly.design/library/glif-app/video-9v2lkh.preview.mp4?v=6d3ba8fe

An AI creative agent sold like a magazine spread: a warm paper ground (#f9f9f4 / #fbfaf6) carries Iowan Old Style display at weight 500 with aggressive negative tracking, set against Manrope 500 for everything functional. The hero is a mind-map, not a screenshot: one prompt card with a soft pastel glow at the center, hairline connectors curving out to the deliverables it would produce (a vertical launch film, a 16:9 campaign film, a sale poster, a soundscape waveform), each a rounded media tile with a caption overlay. Color is almost entirely withheld; the product photography supplies it, the only brand hue is the orange glif wordmark, and the ink is a green-tinted near-black (#151916) rather than pure black. Below the hero the page flips once into a full-bleed near-black band for a live, tabbed product demo, then returns to paper for a reference-board section, an agent-hub diagram and a monochrome model-logo wall, closing on a dark inset CTA card.

## Steal-worthy details

- Serif display at 72/72 with -3.6px tracking (-0.05em) and weight 500, never bold; the tight, book-like setting carries the brand while every UI string stays in a quiet sans
- Prompt card as the hero centerpiece, wrapped in a blurred yellow-to-mint gradient halo that hints at "AI" without a single gradient button or purple glow
- Thin gray curved connectors running from the prompt to scattered output tiles: the hero diagrams input-to-outputs instead of showing a UI screenshot
- Media tiles labeled like files: a bold white title over a muted mono-ish meta line ("00:08 · 9:16", "Final · 1:1") on a bottom scrim, so every image reads as a finished deliverable
- Audio shown as a card: an outlined play button beside a gray bar waveform, title left and "Final · 00:30" right, the same frosted card language as the images
- A tiny gray "New" chip glued to a nav item (MCP), the only badge in the header
- One full-bleed near-black band holding a live chat demo with tabs, checkmarked tool-call chips ("generateImage Café") and a result strip; the dark section frames the product as the main event
- Agent-hub diagram: the black app icon at the center, white rounded app-tile icons around it, joined by dashed sage lines on a gray inset panel
- Model providers as a 5-column monochrome logo grid with generous row gaps and a single linked word in the caption below
- Closing CTA as a dark inset card with a huge, blurred, low-contrast brand glyph behind the serif headline
- Radii on a 0.8rem multiple scale: 12.8px buttons and cards, 25.6px and 38.4px for big panels, 9.6px for chips

## Style recipe

Build on a warm paper ground, #fbfaf6 page with #f9f9f4 panels, and a green-tinted near-black ink, #151916 for primary fills and #101112 for dark bands. Grays run warm: #2e2e2e text, #53514e secondary, #79746e and #92908d muted, #afaca6 and #d3d8d1 for hairlines and dashed lines. Keep color out of the chrome entirely: imagery, logos and one small brand mark (a saturated orange, used only on the logo and icons) supply all hue.

Type: a transitional book serif (Iowan Old Style, falling back to Baskerville) at weight 500 for every heading: 72/72 with -3.6px tracking for h1, 48/48 with -2.4px for h2, 36/36 with -0.9px for h3. Never bold, always tight. Everything else is Manrope 500: 16/24 body in muted gray, 14/20 buttons, 12/16 meta lines with "·" separators.

Buttons: 44px tall, 12.8px radius, solid #151916 with #fbfaf6 text, padding 0 12px 0 16px and a trailing arrow icon. The secondary button is a paper fill with a 1px hairline and a faint shadow. On dark bands, invert: a light button on near-black.

Surfaces: cards on paper get a 1px warm hairline, a 12.8px radius and a soft, wide, low-opacity shadow; large panels step up to 25.6px or 38.4px; chips use 9.6px. Media tiles carry a bottom scrim with a bold white title and a muted meta line. Diagram connectors are thin curved gray lines or dashed sage spokes, never arrows. A single AI cue is allowed: a blurred pastel halo (soft yellow into mint) behind the main input.

Rhythm: mostly light sections with lots of air, a full-width hairline divider between topics, and one or two full-bleed near-black bands reserved for live product demos or the final call to action. Center the hero, split feature sections 50/50 text and visual, and keep copy short: serif headline, two lines of gray body, one button.