Skip to content
Get packs

Solar Duotone Bold Icons

Gives the agent a consistent, two-tone Solar icon style for UI icon sets

Source Download skill
Repository
MengTo/Skills
Stars
7,187
Licence
MIT
Files
4 files

What it does

This skill tells the agent to use the Solar Duotone Bold icon family from Iconify as the default icon set when building an interface. Duotone icons have a main shape plus a lighter secondary fill, so they look richer than plain outline icons. The skill also gives simple rules: keep icon sizes consistent, pair icons with text labels, and avoid mixing in unrelated icon styles.

Great for

  • Front-end developers building web or app interfaces who want a cohesive icon look
  • Designers prototyping screens who want the agent to pick matching icons
  • Teams that already use Iconify and want a single icon style across components

Skip it if

  • Projects with a required brand icon set or design system, since the skill would override it with Solar icons
  • Icon-only controls where users need clear labels; the skill itself warns against relying on icons alone for unfamiliar actions

Try asking

  • “Build a settings page with a sidebar using Solar Duotone Bold icons”
  • “Add feature cards to my landing page with matching duotone icons”
  • “Update the navigation bar icons so they match a consistent style”
Step-by-step guide: how to use Solar Duotone Bold IconsInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 4 original files, the MIT licence and an attribution note.

    solar-duotone-bold.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip solar-duotone-bold.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip solar-duotone-bold.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Name the component or page you are building so the agent can keep icon sizes and opacity consistent within it
  • Ask the agent to add text labels next to icons for navigation and controls
  • Check the demo folder for example output before adopting the style in a production UI

What's inside

  • demo/index.html
  • demo/PROMPT.md
  • demo/source.json
  • SKILL.md

Redistributed unmodified from MengTo/Skills under the MIT licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.