Live demo — an original page built in the Fiction style. Open in new tab
Fiction
A storybook style with warm cream pages, bold rounded type, saturated color blocks, thick inky outlines, and friendly hand-drawn shapes.
Install via CLI
$ npx staqd add fictionRequires Pro — after subscribing, run npx staqd login to authenticate.
Pro skill
from $12/mo
$20/mo, or $12/mo billed yearly · 7-day money-back guarantee.
Inside this skill
Fiction is the warmth of a well-loved picture book — cream pages, fat rounded letters, and bold blocks of color held together by confident inky outlines. Everything feels hand-made and friendly, like an illustration come to life. Reach for it when you want a product to feel approachable, joyful, and human: kids' apps, family tools, gentle onboarding, or any brand that wants to disarm rather than impress.
Design principles
- Warmth first: backgrounds are cream, not white, so the whole interface feels soft and lit by a lamp.
- Outline everything important. A thick ink stroke around cards, buttons, and inputs gives the hand-drawn, storybook signature.
- Round all the corners. Nothing is sharp; shapes are friendly and pillowy.
- Use saturated color blocks as scenery — full-bleed panels of orange, blue, or yellow that frame content like illustration backdrops.
- Pair flat color with soft offset ink shadows (no blur) so elements feel like cut-paper collage lifted off the page.
- Sprinkle hand-drawn touches: squiggle underlines, doodle icons, and slightly irregular shapes keep it human, not corporate.
Color
The page is a warm cream #FBF3E2; cards and panels lift to a brighter cream-white #FFFCF4. The ink color #2B2622 does triple duty as foreground text, outline border, and shadow color — this single dark stroke is what ties the whole style together. Primary actions and energy come from a friendly orange #F0653A; the secondary sky blue #3D86C6 and sunny yellow #F4C04B fill color-block sections and accents. Muted captions use a soft taupe #8A7F6F.
For a dark/evening variant, swap the page to a deep cocoa #241F1B with surface #332C26, keep the same saturated orange/blue/yellow accents (they glow nicely on dark), and flip text to the cream #FBF3E2 — but the bright cream-paper mode is the heart of the style. Whichever mode, always keep the ink-colored outlines and shadows so the storybook structure survives.
Fiction is a Pro skill
Unlock the full Fiction spec — design tokens, component coverage, motion, and accessibility — plus the entire library of design skills and Pro prompts.
- Every design skill, growing weekly
- Full Pro prompt library
- Commercial-use rights on skill output
$20/mo, or $12/mo billed yearly · 7-day money-back guarantee.
Use it with these prompts
Welcome hero
FreeBuild a warm welcome hero in the Fiction style: cream page, a chunky rounded headline in ink, a hand-drawn squiggle underline in orange, and a big pill button with a thick black outline and a soft offset block shadow.
Feature cards
ProSign-up modal
ProMore editorial skills
Paper
editorialA clean, tactile interface inspired by real sheets of paper—soft shadows, gentle layering, and generous whitespace that make screens feel calm and physical.
Cafe
editorialA warm, handcrafted aesthetic of roasted earth tones, soft paper textures, and relaxed serif type that makes an interface feel like a favorite corner table.
Doodle
editorialA hand-drawn, sketchy interface full of wobbly lines and playful imperfection that makes products feel friendly, human, and creative.