Question 1

How do I stop a hero section from feeling static?

Accepted Answer

three cheap layers — a backdrop you can ignore, one typographic moment, one honest action — built in one sitting. Read it in “Build a hero that breathes — in 20 minutes”, or open Aurora Veil for the code.

Question 2

What is the difference between an easing and a spring?

Accepted Answer

an easing is a curve you choose; a spring is a system you tune, and the button shows the tuning. Read it in “Springs are not easings”, or open Halo Button for the code.

Question 3

Which CSS properties can I animate without hurting performance?

Accepted Answer

only transform and opacity stay on the compositor, and the icons show what that buys you. Read it in “Animating on the GPU without asking”, or open Magnetic Icon Row for the code.

Question 4

How do I honour prefers-reduced-motion without gutting the design?

Accepted Answer

the reduced version is designed rather than disabled, which is what the loader handoff does. Read it in “Reduced motion beyond the switch”, or open Preloader Handoff for the code.

Question 5

Why does my animation feel janky on a phone but smooth on my laptop?

Accepted Answer

frame budget, not frame rate, is the number that decides it — and the motes ship a low-end tier. Read it in “The 60fps handshake: what devtools is really telling you”, or open Star Motes for the code.

Question 6

Should I use scroll-linked animation?

Accepted Answer

sometimes yes, often no, and the path shows the version that stays on the compositor. Read it in “scroll-timeline, honestly”, or open Draw-on-scroll Path for the code.

Question 7

How do I write a prompt that produces the same page twice?

Accepted Answer

constraints, order and an explicit checklist; the template is the output the method produces. Read it in “Write AI prompts that reproduce — not ones that 'inspire'”, or open Waitlist Template for the code.

Question 8

What does a good prompt for a landing page actually contain?

Accepted Answer

the brief is the deliverable, and the template is what a well-specified one looks like. Read it in “Writing a brief the model can't ignore”, or open Landing Template (Dark SaaS) for the code.

Question 9

How do I check if my colour contrast is good enough?

Accepted Answer

the maths is four lines, and the banner's four tones all clear 4.5:1 on the page background. Read it in “Colour contrast you can compute”, or open Inline Status Banner for the code.

Question 10

How do I make an empty state that doesn't look broken?

Accepted Answer

an empty state is a first impression with the content missing, which the trio takes seriously. Read it in “Design the empty state first”, or open Empty-state Trio for the code.

Question 11

How should a form tell someone they made a mistake?

Accepted Answer

errors belong next to the field, phrased as a next step rather than a verdict. Read it in “Forms that fail kindly”, or open Password Strength Meter for the code.

Question 12

How do I make focus visible without ugly outlines?

Accepted Answer

a focus ring is a design surface, and the pills treat it as one. Read it in “Focus order is layout”, or open Radio Pills for the code.

Question 13

How do I decide what to put in a sticky header?

Accepted Answer

the header earns its space or it should scroll away. Read it in “The invisible header”, or open Sticky Section Sub-nav for the code.

Question 14

How do I build a personal UI library that survives contact with real projects?

Accepted Answer

the structure matters more than the count — the palette is the search layer that makes a library usable. Read it in “Building a personal UI library”, or open Command Palette for the code.

Question 15

How do I keep a dark theme from looking like an inverted light theme?

Accepted Answer

dark mode is a token decision, not a colour swap — the veil is designed for a dark ground from the start. Read it in “Dark mode is a design system”, or open Aurora Veil for the code.

Question 16

How do I size type so it works on a phone without magic numbers?

Accepted Answer

a clamp() with a stated reason beats a pile of breakpoints, and the numbers hold at both ends. Read it in “Fluid type without magic numbers”, or open Stats Band for the code.

Question 17

When is a glass effect worth the paint cost?

Accepted Answer

glass reads as a material only when there is something behind it to blur. Read it in “Glass is a material — not a trend”, or open Nav Dock for the code.

Question 18

How do I test an interface with a keyboard, honestly?

Accepted Answer

unplug the mouse and try to finish a task — the palette is the component that survives that test. Read it in “The keyboard walk”, or open Command Palette for the code.

Questions the guides answer

01How do I stop a hero section from feeling static?

02What is the difference between an easing and a spring?

03Which CSS properties can I animate without hurting performance?

04How do I honour prefers-reduced-motion without gutting the design?

05Why does my animation feel janky on a phone but smooth on my laptop?

06Should I use scroll-linked animation?

07How do I write a prompt that produces the same page twice?

08What does a good prompt for a landing page actually contain?

09How do I check if my colour contrast is good enough?

10How do I make an empty state that doesn't look broken?

11How should a form tell someone they made a mistake?

12How do I make focus visible without ugly outlines?

13How do I decide what to put in a sticky header?

14How do I build a personal UI library that survives contact with real projects?

15How do I keep a dark theme from looking like an inverted light theme?

16How do I size type so it works on a phone without magic numbers?

17When is a glass effect worth the paint cost?

18How do I test an interface with a keyboard, honestly?

Why an answer page beats a keyword page