solar-duotone-bold — Claude Code skill: what it does, how to install
Guidelines for applying Iconify Solar Duotone Bold icons in UI designs. Useful when standard outline sets feel plain and components need layered visual depth.
npx skills add MengTo/Skills --skill solar-duotone-bold -a claude-codeWhat solar-duotone-bold does
This skill instructs AI assistants to use Iconify Solar Duotone Bold as the standard icon set. It enforces consistent sizing across grouped components and pairs glyphs with labels on controls, navigation bars, and feature cards.
Duotone rendering relies on balanced opacity. Secondary fills must reinforce the main glyph silhouette, while stroke weights and hues match the underlying background contrast. The instructions explicitly warn against using standalone icons for unfamiliar actions.
Compatibility breaks if you blend different aesthetics: mixing Solar Duotone Bold with unrelated outline icons inside the same control cluster is strictly prohibited.
What it helps with
- style component navigation using Solar Duotone Bold icons
- adjust duotone fill opacity to maintain glyph legibility
- align icon dimensions across grouped interface elements
- pair unfamiliar action icons with descriptive text labels
Example prompts for the agent
- Build a feature grid using Solar Duotone Bold icons paired with clear labels
- Update the sidebar navigation buttons to use the Solar Duotone Bold icon family
- Adjust the duotone opacity and stroke contrast for icons on this dark surface
How to install solar-duotone-bold
1Skills CLI (Vercel)
npx skills add MengTo/Skills --skill solar-duotone-bold -a claude-code2Manually: put the files in place
~/.claude/skills/solar-duotone-bold/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/solar-duotone-bold/
1Skills CLI (Vercel)
npx skills add MengTo/Skills --skill solar-duotone-bold -a codex2Manually: put the files in place
.agents/skills/solar-duotone-bold/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add MengTo/Skills --skill solar-duotone-bold -a cursor2Manually: put the files in place
.cursor/skills/solar-duotone-bold/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install MengTo/Skills solar-duotone-bold2Manually: put the files in place
.github/skills/solar-duotone-bold/SKILL.md1Skills CLI (Vercel)
npx skills add MengTo/Skills --skill solar-duotone-bold -a gemini-cli2Platform CLI
gemini skills install https://github.com/MengTo/Skills --path agent-skills/web-design/solar-duotone-boldManually: put the files in place
.devin/skills/solar-duotone-bold/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add MengTo/Skills --skill solar-duotone-bold -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about solar-duotone-bold
How to install solar-duotone-bold in Claude Code?
Run npx skills add MengTo/Skills --skill solar-duotone-bold -a claude-code in your terminal.
What does solar-duotone-bold do?
It provides prompt rules for selecting, sizing, and styling Iconify Solar Duotone Bold icons in user interfaces.
Can Solar Duotone Bold be mixed with regular outline icons?
No, the skill rules forbid mixing Solar Duotone Bold with separate outline icon sets within the same group of controls.
Source text
SKILL.md · MIT
--- name: solar-duotone-bold description: "Use Iconify Solar Duotone Bold icon style." --- # Solar Duotone Bold Skill ## Use When - A UI needs cohesive icons with a richer look than generic outline icons. ## Workflow 1. Use Iconify Solar Duotone Bold as the default icon family. 2. Keep icon sizes consistent within a component group. 3. Pair icons with clear labels for navigation, controls, and feature cards. 4. Use duotone opacity intentionally so secondary fills support the main glyph shape. 5. Match stroke, fill, and color treatment to the surrounding surface contrast. ## Guardrails - Do not mix Solar Duotone Bold with unrelated outline icon families in the same control set. - Do not rely on icons alone for unfamiliar actions.
© MengTo · MIT · MengTo/Skills
