# break-ui

> Claude/Codex skill by [@emilkowalski](https://omgskills.com/library/emilkowalski/index.md) · 56k stars · 111k installs · Updated 2026-11-12

Try to break a piece of UI by feeding it worst-case data — long names, unbreakable emails, one-letter names, missing fields, huge counts, zero items, long labels, non-Latin text, emoji, extreme numbers — then render it behind a "Demo data / Worst case" toggle and report everything that broke, with the fix for each. Use when the user asks to stress-test, break, or find edge cases in a component or screen, or to "try the worst case". For visual design critique use emil-design-eng; for motion use review-animations.

Tags: agent-skills, animation, claude-code, codex, cursor, design-engineering

## Install

```sh
git clone https://github.com/emilkowalski/skills /tmp/skills && ln -s /tmp/skills/skills/break-ui ~/.claude/skills/break-ui
```

## From README

Breaking UI Initial Response When this skill is first invoked without a specific question, respond only with: I'm ready to throw the worst realistic data at your UI and show you what breaks, my standards come from Emil Kowalski's design engineering philosophy. Do not provide any other information until the user asks a question. An adversarial skill. It does ONE thing: take a piece of UI that looks right with demo data, find the realistic worst case for every value it renders, put both datasets behind a toggle, and report what broke. It does not redesign the component (that's prototype), critique its taste (that's emil-design-eng), or review its motion (that's review-animations). Operating Posture You are the most annoying real user this component will ever meet. Your name is Aleksandra Wiśniewska-Kowalczyk, your colleague's email is bartholomew.fitzgerald@northwind-industries-holdings.example.com, your intern is called Jo, and your workspace has 1,284 members.

## Links

- HTML page: https://omgskills.com/library/emilkowalski/skills/break-ui/
- GitHub: https://github.com/emilkowalski/skills
- Author: [@emilkowalski](https://omgskills.com/library/emilkowalski/index.md)

## More from this repo

- [animation-performance](https://omgskills.com/library/emilkowalski/skills/animation-performance/index.md) — Keep web animations inside the frame budget — animate composite-only properties, keep motion off the main thread when...
   - [@emilkowalski](https://omgskills.com/library/emilkowalski/index.md) · 57k stars
- [learn-taste](https://omgskills.com/library/emilkowalski/skills/learn-taste/index.md) — Turn the design corrections a user made during a session into rules the next agent follows.
   - [@emilkowalski](https://omgskills.com/library/emilkowalski/index.md) · 56k stars
- [emil-design-eng](https://omgskills.com/library/emilkowalski/skills/emil-design-eng/index.md) — This skill encodes Emil Kowalski's philosophy on UI polish, component design, animation decisions, and the invisible...
   - [@emilkowalski](https://omgskills.com/library/emilkowalski/index.md) · 56k stars
