1.3 KiB
1.3 KiB
Image Maker Memory — Kontra Day
Overview
I generate UI design mockup images for the Kontra Day news-opinion site via the OpenRouter image API.
Workflow
- Get API key:
source ~/.config/environment.d/10-secrets.conf(env varOPENROUTER_API_KEY) - Model used:
openai/gpt-5-image-mini - Call format:
curl .../chat/completionswith{"model": ..., "messages":[{"role":"user","content":"Generate image: <detailed description>"}]} - Image returned as base64 in
choices[0].message.images[0].image_url.url(data URI). Decode and save as PNG.
Notes
- Output comes back as square 1024x1024 even when a wider aspect is requested. Don't expect strict size matching.
- See
skills/design-explore/SKILL.mdfor the full mockup-generating workflow and the Kontra Day design system.
Kontra Day Design System (design tokens to embed in prompts)
- Palette: canvas
#fbf9f3(warm newsprint off-white), wells#f0eee8/#eae8e2, hairlines#e4e2dd, ink#1b1c18(soft charcoal, NOT pure black), muted#444748, faint#747878, vermilion#ad3222, dark inverse#1c1b1b+ white text. - Typography: Newsreader (masthead/headlines), Literata (body 17-19px, lh ~1.6), Work Sans (UI labels/caps).
- Shape: 0px radius everywhere, flat + hairline rules, no shadows/gradients.
- Spacing: 8px grid; content column max 42rem centered.