Art Direction Daily

New this week · Model pricing

Google shipped three Flash tiers. Pick one.

Gemini 3.6 Flash, 3.5 Flash-Lite, and a governments-only Flash Cyber landed together, each with a real per-token price. Today's issue reads the launch the way a buyer would: as a plan page.

Three graduated stacks of brass and ceramic discs, short to tall, on a warm peach surface, with a single coral disc on the middle stack.
Three tiers, one currency: tokens

Flash-Lite

Gemini 3.5 Flash-Lite, for low-latency, high-throughput work.

$0.30/ 1M in

$2.50 / 1M output

  • 350 output tokens per second
  • 54% on Terminal-Bench 2.1
  • Rolling out to Search
On AI Gateway

Flash Cyber

Gemini 3.5 Flash Cyber, for vulnerability finding and patching.

Contact/ gated

Governments & trusted partners

  • Ships only inside CodeMender
  • Frontier scores on CyberGym
  • Limited-access pilot
See the terms

Prices and figures from Google's launch post, July 21, 2026. Input/output billed per million tokens.

Compare

What each tier is actually for

The Flash line is now a ladder: pick by latency and budget, not by name.

 Flash-LiteFlashFlash Cyber
Best forThroughputCoding, agentsVuln patching
Input / 1M$0.30$1.50Gated
Output / 1M$2.50$7.50Gated
Headline stat350 tok/s49% DeepSWECyberGym frontier
AccessOpen APIOpen APIPilot only

The interesting tier is the one you cannot buy. Flash Cyber ships only through Google's CodeMender agent, to governments and trusted partners, tuned to find and patch vulnerabilities. A week after our own advisory on agent sandbox escapes, the same capability is being sold as defense on one shelf and rented as offense on another.

Add-ons

Also shipping this week

Tooling

Webflow MCP 2.0

Webflow's agent protocol now hands Claude, ChatGPT, and Cursor the site's design system and CMS, plus a shared Agent Instructions file so brand and compliance rules ship with the build.

Models

Qwen-Image-3.0, closed

Alibaba shipped its third image model with no weights, no benchmarks, and no technical report, a sharp turn from the open release its 3.8 language model promised two days earlier.

Framework

Next.js 16.2.11

Two stable patch releases landed the same day, 16.2.11 and 15.5.21, keeping both active branches current while 16.3 keeps churning through canaries.

Today's Art Direction: The Pricing Page

A SaaS plan page, warm peach and coral, with one anchored tier.

The pricing page is the most decision-shaped layout a web designer builds: three or four plan cards in a row, one lifted as recommended, a per-unit price set large, a short feature list under each, and a comparison matrix for the reader who wants the detail. It works because it turns a catalog into a single choice. Today's page runs that grammar straight, casting Google's three Flash models as the three plans and letting the model that costs the most attention, not the most money, sit in the anchored middle slot.

Plan cards Anchored tier Per-unit price Feature checklist Comparison matrix Billing toggle Contact tier

Borrow this pattern

The anchored middle tier

Give a three-card price row a single visual anchor: lift one card with a filled background, a small badge, and slightly taller padding, and every other card is read in relation to it. The eye lands there first, the price beside it feels reasonable by comparison, and the choice gets easier. Reuse it for plan pages, feature tiers, and package selectors. The discipline is honesty about which card you anchor: it has to be the one you would actually recommend, not merely the most expensive. Anchor the wrong tier and the pattern reads as a trap the moment a buyer does the math.

Take-home

Prompt Lab

Build a one-page pricing page for a product called [NAME] with three plans: [LITE], [STANDARD], [ENTERPRISE].

Art direction: warm, premium, and calm, not a generic dev-tool table. Ground the page in warm peach-ivory (#FBF1E7) with white cards (#FFFFFF), deep plum ink (#2C2230), muted plum for secondary text (#6C5F68), one coral accent (#E0492F) for CTAs and the recommended badge, and a deep teal (#17706A) for the feature checkmarks. Hairline borders (#E7D8C8), square-ish corners (0 to 2px), one soft shadow only on card hover.

Type: Gambetta (600) for the headline, plan names, and big prices; Figtree for body at 19px and 1.65 line height; Space Mono for the eyebrow, prices-per-unit, badges, and the comparison table.

Layout, top to bottom:
1. Top bar: wordmark and two links.
2. Split hero: a mono eyebrow, a serif headline, a two-sentence deck, and a small non-interactive billing toggle on the left; a framed premium still-life photograph on the right (warm, abstract, no text).
3. Three plan cards in a row. Anchor the middle card: fill it with the dark plum, give it a coral "Recommended" badge and a touch more padding. Each card has a plan name, a one-line "who it's for," a large per-unit price with a mono unit label, a small secondary price line, a plus-marked feature list, and a full-width CTA (solid coral on the anchored card, outlined on the others). The third card can be a "Contact" tier with no numeric price.
4. A horizontally scrollable comparison matrix: row labels down the left, one column per plan, the recommended column tinted. Mono numerals.
5. A three-card "also shipping" row on a tinted band for supporting items.

Readability guardrails: body at least 18px, WCAG AA contrast for coral and teal on their actual surfaces and for light text on the dark anchored card, real hover and focus states on cards, links, and CTAs (150ms ease), a reduced-motion media query, and no fake interactive toggles that imply state they do not have. No gradients, no glow, no three identical feature icons, no stock 3D blobs.

Any competent site agent handles it: Beaver Builder AI, Lovable, Bolt, v0, Figma Make.

Field note

Model launches used to read like research. This one reads like a rate card. When the news arrives pre-sorted into tiers, the honest thing a designer can do is lay it out plainly and let the buyer see what each choice costs.