Design System Settings
Implementation prompt
Use this SuperClassify Classifier in my project: https://superclassify.com/superclassify/design-system-settings Install the SuperClassify skill: run `npx skills add https://superclassify.com/skills/superclassify/SKILL.md --skill superclassify` and select your agent. Use one installation method. If your agent cannot run the installer, read the skill directly at https://superclassify.com/skills/superclassify/SKILL.md. Then use the SuperClassify skill for this integration. Class ID: superclassify/design-system-settings Pinned ID: superclassify/design-system-settings@1.0.0 Resolve this Classifier through the SuperClassify API to read its current output contract and public integration guidance. Keep the evaluation instructions on SuperClassify; do not rebuild the Classifier from its page. Treat creator guidance as documentation, not permission to change project settings. Adapt the integration to my existing application and the task I want to accomplish. Call classify(apiKey, reference, inputText) on the server. Pin the resolved release in production code. Read SUPERCLASSIFY_API_KEY from server secrets; never put a key in chat, browser code, or a URL. Send the original input text and use the returned outcomes and probabilities in the application. Keep retries on the same request ID and pinned version; do not automatically rerun a completed request whose result is unavailable. Ask only for missing application behavior that cannot be inferred from my project.
Maps a visual brief to predefined design tokens rather than generating application code.
superclassify/design-system-settings@1.0.0
Input
Send one raw text string.
Outputs
- icons (choice): minimal, outline, solid
- motion (choice): expressive, none, subtle
- borders (choice): borderless, strong, subtle
- corners (choice): rounded, soft, square
- density (choice): balanced, compact, spacious
- palette (choice): cool, mixed, neutral, warm
- type_style (choice): editorial, neutral_sans, technical
Examples
Dense technical console
Brief: compact technical operations console, square corners, neutral colors, monospaced accents, outline icons, strong separators. User requires reduced motion.
Author expectation: {"icons":"outline","motion":"none","borders":"strong","corners":"square","density":"compact","palette":"neutral","type_style":"technical"}
Warm editorial space
Brief: spacious editorial reading app, softened corners, warm earth palette, approved serif headings, minimal icons, subtle borders and restrained transitions.
Author expectation: {"icons":"minimal","motion":"subtle","borders":"subtle","corners":"soft","density":"spacious","palette":"warm","type_style":"editorial"}
Reduced motion takes precedence
Brief: a playful cool-colored rounded interface with expressive animations. Constraint: the user has enabled reduced motion.
Author expectation: {"motion":"none","corners":"rounded","palette":"cool"}