patterns

UI/UX guidance from established sources, brought together in one place.

About

Work in progress. We’re reviewing and expanding this guide. Patterns and examples may change as the site develops.

AI agent skill

Use the Patterns guides with your AI agent to choose interface patterns, compare tradeoffs, and check implementation details.

Read SKILL.md

Use the skill with your agent

For an agent that can read web pages, give it this instruction:

Use the Patterns UI/UX skill at https://patterns.alexanderclaes.be/SKILL.md for this task. Read the relevant linked guides before recommending or implementing a pattern.

If your agent supports local skills, save the file as patterns-ui-ux/SKILL.md in its supported skills directory. The skill links to this website’s Markdown guides, so the agent needs web access to read them.

Skill contents

A workflow and index of all 19 guides. Each linked Markdown guide includes its recommendation, use and avoid conditions, implementation guidance, tradeoffs, verification question, and sources.

Keeping it current

The skill index and Markdown guides are generated from the same content as the website on every build. Content changes are published together, and the skill asks agents to read the current relevant guides.