skills.rest
douinc
douincOFFICIAL
Explore all skills by this author →
WebsiteGitHub

figma-icons-iconify

Fetch SVG icons from Iconify and insert them into Figma designs.

1|Updated Apr 9, 2026
Search Tags:#design#ui#figma#icons#svg#iconify#iconography
One-click install
npx skills add https://github.com/douinc/agent-skills --skill figma-icons-iconify
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: figma-icons-iconify
Source: https://github.com/douinc/agent-skills/tree/main/skills/figma-icons-iconify
Command: npx skills add https://github.com/douinc/agent-skills --skill figma-icons-iconify

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Icon shortages in Figma can slow UI work; this skill fetches pixel-perfect SVG icons directly from Iconify to streamline iconography.

Core Features & Use Cases

  • Retrieve icons from 150+ icon sets (Tabler, Lucide, Material Design, Phosphor, Heroicons, and more) and insert them into Figma.
  • Enforce best-practice workflow by requiring pre-fetch via curl and then insertion via figma APIs, with proper naming like Library/icon.
  • Use cases include designing UI kits, dashboards, and marketing assets with consistent iconography.

Quick Start

Fetch an Iconify SVG and insert it into a Figma design using the prescribed workflow.

Frequently Asked Questions about figma-icons-iconify

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fetch real SVG icons from Iconify into Figma designs?▼

You retrieve SVG icons by pre-fetching them via curl and inserting the SVG data into Figma using the figma.createNodeFromSvg API. This workflow ensures pixel-perfect iconography while preserving source provenance through library-aware naming.

What icon sets are available for UI design in Figma through Iconify?▼

The Skill supports retrieving and inserting SVGs from 150+ Iconify sets, including Tabler, Lucide, Material Design, Phosphor, and Heroicons. This allows you to maintain consistent iconography across UI kits, dashboards, and marketing assets.

Can I perform bulk icon searches for scalable UI work in Figma?▼

Yes, bulk icon searches are supported to facilitate scalable UI work. You can fetch and insert multiple real SVG icons from Iconify into your Figma designs, streamlining the process of building comprehensive UI kits and dashboards.

Why do I need to use curl before inserting Iconify SVGs into Figma?▼

Pre-fetching with curl is required to enforce a best-practice workflow, ensuring the raw SVG data is correctly retrieved before insertion. This guarantees pixel-perfect icon rendering when using the figma.createNodeFromSvg API.

Does fetching icons this way preserve the icon library source in Figma?▼

Yes, source provenance is preserved by enforcing library-aware naming conventions like Library/icon during insertion. This ensures you can track the origin of your SVG icons within your Figma design files.

Related Skills

Explore More Design & Creative Skills→
jaguarliuujaguarliuu

icon-retrieval

Search an icon library by keyword and retrieve SVG strings with metadata.

Community
Intermediate
pengelbrechtpengelbrecht
6

SVG Logo Designer

Generate scalable SVG logo concepts from descriptive briefs with layout variations.

Community
Intermediate
PL-Coding-GmbHPL-Coding-GmbH
6

figma-to-android-vector

Converts SVG icons from Figma into Android VectorDrawable XML and ImageVector files.

Official
Advanced
petbrainspetbrains
13

frontend-iconify

Search an icon API by concept and download SVGs for React components.

Official
Basic