Skip to content
All skills
staqd.ai/previews/fiction
Open

Live demo — an original page built in the Fiction style. Open in new tab

Proeditorial

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 fiction

Requires 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.

Kids and family productsFriendly onboarding and explainer pagesPlayful brand sites and community apps

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

Free

Build 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

Pro
Unlock this prompt with ProUpgrade

Sign-up modal

Pro
Unlock this prompt with ProUpgrade