ui-ux-designer
AI Design Lead: Access to style, palette, and typography databases.
Installation
Follow the repository instructions for this skill and your agent. Review the files and dependencies before adding it to your workflow.
View source ↗GuidesSkill instructions
UI/UX Designer Skill
Activate this skill when you need to make aesthetic decisions, generate CSS, or define the project's style.
🛠️ Tools
Style Search
Use this command to find real (not invented) configurations:
uv run .agent/skills/ui_ux_designer/scripts/search_design.py --query "<keywords>" --type <colors|typography|styles|products|ux|landing|charts>
📋 Operational Protocol
- Search: Always search the database before proposing a color.
-
Apply: If you're hydrating a project (
custom_project), use the found values to compiledocs_custom/brand_identity_guide.md. - Fallback: If the database returns no results, use the "Minimal Monochrome" style.
🚫 Prohibitions
- Do not invent Hex codes (e.g.,
#123456) if not present in the database or inbrand_identity_guide.md(unless they are calculated shades). - Do not hardcode styles in React components without first defining them in global tokens.
Examples
Read the usage examples in the source repository.
View source ↗Source history
- Indexed on
- 2026-01-20
- Index updated
- 2026-03-03
- Branch
- main
Index and sync dates describe this directory. View the source repository for code history.
GitHub ↗chat Comments (0)
Sign in to join the discussion and leave a comment.
No comments yet. Be the first to share your thoughts!