Blume — Floral Coding-Agent Companion

---
version: alpha
name: Blume — Floral Coding-Agent Companion
colors:
  paper: '#F7F4EE'
  ink: '#1A140D'
  sky: '#0484E8'
  coral: '#FF7F50'
  night: '#14110D'
  white: '#FFFFFF'
typography:
  heading:
    fontFamily: Gelica, "Fraunces Variable", Fraunces, Georgia, serif
    fontSize: 60px
    fontWeight: 500
    lineHeight: 60px
    letterSpacing: -1.5px
  body:
    fontFamily: 'SN Pro Variable, system-ui, sans-serif'
    fontSize: 19px
    fontWeight: 400
    lineHeight: 27.55px
---

## Overview
A warm, illustrated developer-tool homepage built around a sunny alpine flower field, expressive serif headlines, and cream-colored desktop-app previews. The sharp blue opening transitions into quiet off-white storytelling, an interactive product demonstration, feature cards and a dark closing call to action. Desktop inspected at 1440px and opening mobile viewport at 390px on 2026-10-03. The published screenshot is the opening desktop viewport, not a full-page image or animation recording. Lower-page guidance comes from separate browser inspection.

## Colors
Computed opaque CSS samples include paper #F7F4EE, warm ink #1A140D, sky #0484E8, coral #FF7F50 and near-black #14110D. The panoramic artwork contains additional blues, greens and golden flowers; it is not a flat sky-color block. White hero text sits over the blue sky. The download action uses a richer orange gradient and dark red lettering rather than a plain coral fill. Cream product windows and translucent agent cards soften the technical subject.

## Typography
The desktop hero uses the computed Gelica/Fraunces serif stack at 60px, weight 500, 60px leading and -1.5px tracking. Supporting copy uses SN Pro Variable at 19px / 27.55px. Section headings measure 56px / 56px; the closing heading measures 84px / 78.96px. Feature titles mix compact serif and sans-serif treatments. At 390px the hero title is 34px / 34px with -1.02px tracking. Font-family declarations are observed stacks, not proof of which fallback rendered. Use appropriately licensed fonts.

## Layout
Center the small flower-and-wordmark above a compact two-line headline, short description and single download pill. A diagonal hiring ribbon occupies the top-right corner. Below the introduction, a tall cream app window overlaps several small agent windows and the landscape fades into paper. A quiet compatibility strip precedes generously spaced alternating illustration/text rows. The hydrated product demo pairs a vertical list of capabilities with a larger app preview. A three-column desktop feature grid distinguishes current features from Soon and Next items. The closing section returns to an oversized headline and download action. Desktop text blocks generally remain narrow; hero supporting text measures 560px wide. Mobile centers the introduction, reduces the headline and rearranges overlapping agent cards; lower mobile sections were not visually audited. Do not infer exact breakpoints from two captured widths.

## Elevation & Depth
Use scenery layers, soft shadows and translucent agent windows for the opening depth. Cream app chrome has a fine warm border and a diffuse shadow. Pale feature surfaces are quieter than the hero. The active demo row is distinguished by a soft outline and tonal glow. The final section uses a dark scenic backdrop and shade to protect text contrast. Avoid applying the hero's visual density throughout the page.

## Shapes
Contrast the organic flowers and hills with orderly rounded application windows. Download links are fully rounded pills (computed 9999px radius) containing a smaller platform badge. Small traffic-light window controls communicate desktop software. Feature cards have restrained rounded corners; flower markers remain distinct illustrations, not generic circular icons.

## Components
Flower wordmark, diagonal hiring banner, centered hero, platform-aware download CTA, layered agent previews, compatible-agent logo strip, alternating illustrated benefits, tabbed capability/app demonstration, flower-marked feature grid, future-feature badges, closing download CTA and footer links. The Linux capture labels the download AppImage and version v1.0.74; that is an observed environment-specific state, not a platform limitation. The product demo was inspected separately after hydration; it is not included in the published opening-viewport screenshot. Pricing and account forms were not linked from the inspected homepage; no account creation or download was performed.

## Do's and Don'ts
Preserve the contrast between vivid scenery and calm editorial content. Keep flowers tied to brand and feature markers, and preserve the hierarchy of present versus planned features. Do not replace useful application imagery with generic cards or claim the depicted app functionality was tested. Provide readable contrast, keyboard-operable controls, descriptive labels and a reduced-motion alternative when adapting; these are implementation recommendations rather than an accessibility audit. Treat the artwork as a reference, not an asset license. Motion timings, hover states and exact easing were not measured.