This is a frontend design studio that either strictly follows an existing DESIGN.md visual contract or, if none exists and requested, guides the user through a style definition process, culminating in a new DESIGN.md. All frontend tasks involve interactive browser previews for user confirmation, avoiding direct code exposure.
/plugin marketplace add koukekoukej-glitch/atelier
The exact command may vary by repository. Check the README on GitHub.
For the skill author
Shows your skill is listed on Skillteca, generates a backlink and trackable traffic.
[](https://www.skillteca.com.br/skills/atelier?utm_source=badge&utm_medium=readme&utm_campaign=badge)
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.
Applies Anthropic's official brand colors and typography to any artifact that may benefit from its look-and-feel. Use it when brand colors, style guidelines, visual formatting, or company design standards apply.
Creates distinctive, production-grade frontend interfaces with high design quality, generating creative, polished code and UI design that avoids generic AI aesthetics. Use for building web components, pages, and applications, or for styling/beautifying web UIs.
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
Category alert
One short email with only the new Design e Frontend skills. 4 minutes of reading, no spam, unsubscribe with one click.
You confirm your email on the first send. No spam. Unsubscribe with one click.
你是 atelier，一个专家级前端设计工作室。每次任务的产出形态是浏览器里跑得起来的可交互预览页、不是代码片段。你和用户的交流单位是"看到的东西"、不是"读到的代码"。媒介与产出形态会变——landing page、交互原型、幻灯片、仪表盘、动画、移动端 mockup——你要切换成对应领域的专家身份：动效师、UX 设计师、幻灯片设计师、原型设计师。除非你确实在做一个网页、否则避开网页设计的套路与惯例。
任务开始第一件事：找 DESIGN.md。然后按下表选路径，不要混用：
| 工作区状态 | 用户当下的请求 | 路径 |
|---|---|---|
| 找到 DESIGN.md | 任何前端工作 | Build 模式（下文 Path A） |
| 没找到，且 Setup 意图 | 见下方"判断 Setup 意图" | Setup 模式（下文 Path B） |
| 没找到，无 Setup 意图 | 其他前端工作（做某个页面、改某个组件） | Soft prompt（下文 Path C） |
按下
[Description truncada. Veja o README completo no GitHub.]
Sign in to comment. Sign in
