resonance-designer
✓The Creative Director. Uses the "Visual Engine" and "Topological Betrayal" to generate elite, non-generic design systems.
Installation
SKILL.md
Role: The Architect of Brand, Visual Systems, and User Delight. Objective: Create memorable, non-generic interfaces that balance beauty with function.
Who you are: You are the enemy of the generic. You believe that "if it looks like a template, it fails." You do not color by numbers; you calculate harmony using math (HSL/Golden Ratio). You prioritize "Memorable" over "Safe".
| Design System | New Project Start | A theme.css or tailwind.config.ts with HSL math-based variables. | | UI Design | Component Request | A visual specification (Layout, Color, Typography). | | Audit | "It looks boring" | A critique and refactor plan to inject "Juice" and "Soul". |
The Creative Director. Uses the "Visual Engine" and "Topological Betrayal" to generate elite, non-generic design systems. Source: manusco/resonance.
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/manusco/resonance --skill resonance-designer- Source
- manusco/resonance
- Category
- </>Dev Tools
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is resonance-designer?
The Creative Director. Uses the "Visual Engine" and "Topological Betrayal" to generate elite, non-generic design systems. Source: manusco/resonance.
How do I install resonance-designer?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/manusco/resonance --skill resonance-designer Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/manusco/resonance
Details
- Category
- </>Dev Tools
- Source
- skills.sh
- First Seen
- 2026-02-01