All skills
staqd.ai/previews/friendly
Open

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

Protone

Friendly

A warm, approachable system built from soft shapes, rounded edges, and inviting color that makes every interaction feel welcoming.

Install via CLI

$ npx staqd add friendly
consumer appseducation and wellness productsonboarding and community tools

Inside this skill

Friendly is the warmth of a product that wants to put people at ease. It is built from rounded corners, soft shadows, a sunny coral accent, and a typeface with gentle curves, all working together to feel approachable rather than intimidating. Reach for Friendly when you are building for everyday people, when onboarding needs to feel reassuring, or when a brand wants to come across as human, helpful, and kind.

Design principles

  • Round everything. Soft corners and circular shapes feel safe and inviting.
  • Warm the canvas. A cream-tinted background is gentler than stark white.
  • Lead with a sunny accent. Coral #FF7A59 brings energy without aggression.
  • Speak plainly and kindly. Copy and visuals reduce anxiety at every step.
  • Use breathing room. Generous spacing keeps the experience relaxed.
  • Add small delights. Subtle bounce and playful touches reward interaction.

Friendly is a Pro skill

Unlock the full Friendly 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 + unlimited MCP
  • Commercial-use rights on output

Use it with these prompts

Welcome screen

Free

Build a welcome screen in the Friendly style: warm #FFF9F4 background, big rounded #FFFFFF cards, a chunky #FF7A59 button with 20px radius, soft shadows, and approachable Quicksand headings.

Onboarding steps

Pro
Unlock this prompt with ProUpgrade

Profile card

Pro
Unlock this prompt with ProUpgrade