Documentation

Complete guide to integrating CopyIcons into your workflow. From simple SVG copies to automated build pipelines using our API.

Drag & Drop Ready

Copy raw SVG code directly into Figma, Sketch, or VS Code. Pre-optimized paths mean zero clean-up required.

Framework Native

Get pre-formatted components for React, Vue 3, and Svelte. Props like `size` and `color` are automatically exposed.

Account Setup

While guest access is generous, an account unlocks the full potential of CopyIcons, including persistent collections and project-based font management.

1

Create your free account

Click the "Sign Up" button in the top right corner. You can use your email or GitHub for instant access.
Go to Registration
2

Access your dashboard

Once logged in, you can view your "Starred Icons" and "Custom Fonts" from the user dropdown.
3

Create your first API Key

If you plan to use our CLI tool, navigate to Settings > API and generate a read-only key.

copyicons login --key=ci_live_...

We never sell your data or email address. Read our Privacy Policy.

Efficient Icon Searching

Stop wasting time browsing endless pages. Our search engine uses fuzzy matching and semantic tagging to find what you mean, not just what you type.

Keyboard Shortcuts

Open Search /
Close Modal Esc
Copy Active Icon Cmd + C

Search Operators

Use these prefixes to filter results instantly:

style:outline user

set:material-design home

license:mit

Mastering the Kit Builder

Webfonts are the most performance-efficient way to deliver large icon sets. Unlike SVG sprites which can bloat your DOM, a WOFF2 font loads asynchronously and is cached by the browser.

1

Queue your icons

As you browse, click the small + icon on any card. This adds it to your temporary "Font Queue". You can mix and match icons from different sets (e.g., mixing FontAwesome with Material Design).

2

Configure & Build

Within the Kit Builder page:

Name your font: This will be the font-family name in CSS.
Prefix: Default is `icon-`. Changing this avoids conflicts with other libraries.
Versions: We automatically version your font urls to prevent browser caching issues on updates.

Remapping unicode points is handled automatically. You don't need to worry about character collisions.

3

Production Deployment

Once built, we provide a permanent CDN link. For high-traffic production sites, you can also download the `.zip` containing the `.woff2`, `.ttf`, and `style.css` to host yourself.

                                <!-- Recommend adding preconnect for faster load -->
                                <link rel="preconnect" href="https://api.copyicons.click">
                                <link rel="stylesheet"
                                href="https://api.copyicons.click/css/font/my-project-v1.css">
                            

Developer API

Automate your icon workflows. Our API is RESTful and returns JSON.

GET /v1/icons/search

Search for icons programmatically. Supports the same query parameters as the UI.

                                    curl "https://api.copyicons.click/v1/icons/search?q=rocket&limit=5" \
                                    -H "Authorization: Bearer YOUR_API_KEY"
                                

POST /v1/fonts/build

Trigger a font build from a list of icon IDs.

                                    {
                                    "name": "checkout-flow",
                                    "icons": ["fa-user", "md-cart", "lucide-credit-card"]
                                    }
                                

Frequently Asked Questions

Can I use these icons commercially?

Yes! We only index icons with permissive open-source licenses (MIT, Apache 2.0, CC-BY). However, you should check the specific license of the icon set you are using.

How long are fonts hosted?

For free accounts, fonts are hosted for 1 year since the last access. Paid plans offer permanent hosting and global CDN edge caching.

Do you support SVG sprites?

Yes, the generic "Download" options on the Collection page allow you to export a single `sprite.svg` file.