ask-sonner

An agent skill by emilkowalski, from emilkowalski/skills. Tags: animation, design, web.

What it does

Guide to Sonner, the React toast library — install and wire up the Toaster, pick the right toast() call, promise and loading toasts, updating, dismissing and persisting toasts, styling, theming and icons, positioning and multiple toasters. Use when working with Sonner or troubleshooting it — toasts that don't appear, appear twice, lose their styles, ignore Tailwind classes, sit behind a modal, or don't follow dark mode.

Install

With the skills CLI, which installs into Claude Code, Codex, Cursor and other agents:

npx skills add emilkowalski/skills --skill ask-sonner

Or copy the skill folder into Claude Code's skills directory by hand (~/.claude/skills for every project, or .claude/skills inside one):

git clone --depth 1 https://github.com/emilkowalski/skills
cp -r skills/skills/ask-sonner ~/.claude/skills/ask-sonner

Safety box score

Not rated yet. A safety box score grades what a skill and its scripts can reach on the machine of whoever installs it, across eight categories from shell execution to secrets access. Anyone can request one from this page; it is saved for everyone. How the score works.

Source

Repository

emilkowalski/skills (all skills from this repository)

Path

skills/ask-sonner/SKILL.md

Branch

main

Updated

2026-09-22

Related skills

• animate — Build an animation from scratch, making the decisions in the order that determines whether it feels right — should it animate at all, what purpose, which tool.
• animate-expo — Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate.
• animation-vocabulary — Reverse-lookup glossary that turns a vague description of a web animation or motion effect into its exact term ("the bouncy thing when a popover opens" → Pop.
• apple-design — Apple's approach to interface design and fluid, physical motion, translated for the web.
• emil-design-eng — This skill encodes Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible details that make software feel great.
• find-animation-opportunities — Search a codebase or UI for places that don't animate but should, and reject everything that shouldn't.