⏳ This skill is pending AI review.
Scores will appear once the review pipeline completes.
add-skill
suta 저장소에서 진입 스킬 suta에 UI 패턴(애니메이션·UI·UX)을 추가하거나 기존 패턴을 수정·재검증하는 파이프라인(선택 평가 → 패턴 문서 → 데모 → 카탈로그 → 게이트). "패턴 추가해줘, 스킬 추가해줘, {패턴} 패턴으로 등록해줘, 데모 다시, 재검증, 리뷰 다시" 요청에 쓴다. 패턴 내용에 대한 단순 질문에는 쓰지 않는다.
Choose how to use this skill
You do not need every option. Choose the path your AI client supports. The stable page stays the same; versioned files are immutable.
1. Native installer
This listing has no registered native installer command. Use the complete package or source fallback below, depending on what your client supports.
Do not guess an installer command or replace an existing version without reviewing the diff.
2. Complete package recommended
Download the ZIP when available. It includes SKILL.md plus the references, security notes and version metadata.
No complete ProSkills package is published for this listing yet.3. Prompt-only
Copy the prompt above when the agent can read the stable page or when you want to adopt the workflow without installing a skill.
Need only the instruction file?
Download SKILL.md only if your client requires a single file. The complete ZIP is safer for a full installation because it preserves the references and release context.
No path installs or executes anything by itself. Your agent still needs access to the project files. Before updating, compare the installed version and review the diff.
// RATINGS
// README
suta
A UI skill for Claude Code and Codex, with layout, color and motion guidelines and code for 57 patterns.
I built suta to reduce the repetitive cards, excessive colors and unnecessary decoration I kept seeing in AI-generated UI.
한국어 · Live demo · Install · Full guide
Same request, model and settings in Claude Code. Top: without suta (one run). Bottom: run 3 of 4 with suta 0.8. Results vary; generation took longer with suta. Method, all results and limitations · Photo credits
Installation
Claude Code — run in the chat:
/plugin marketplace add Guksu/suta
/plugin install suta@suta
Codex — run in a terminal, then approve suta's post-edit check in /hooks:
codex plugin marketplace add Guksu/suta
codex plugin add suta@suta
Other agents / skill only — installs the guidelines and patterns without the plugin's post-edit check:
npx skills add Guksu/suta --skill suta
Install options and migration · Updating · skills.sh listing
Try it
After installing, ask your agent:
Use suta to build a login screen with email, password, a sign-in button and a password reset link. Keep it simple and make it usable with a keyboard.
The agent reads the guidelines and adapts the pattern code to your project. The plugin also checks layout and motion after edits. Skill and pattern documentation is in Korean; English usage notes are in the full guide.
Try the patterns in the live demo. Browser checks are still needed; static checks cannot catch every UI problem.
Follow development
I use suta in my own work and will keep fixing issues and updating the guidelines and patterns. If something feels wrong, open an issue with your request and what happened.
Releases · Screen comparisons · Benchmark · Contributing
License
The code is MIT (© 2026 Guksu). Licenses for the photos in the comparison image are in Image credits.
// HOW IT'S BUILT
KEY FILES