Icons8 MCP server

Server MCP Icons8

422.674 ikon SVG dan PNG dalam 130 gaya, langsung masuk ke editor AI yang sudah Anda gunakan

Gunakan gratis

Product Hunt

Produk hari ini

Paket ikon besar, hingga 40.000 ikon dalam satu gaya

130 gaya untuk dipilih

Berfungsi dengan

Claude Code,

Codex,

Cursor,

Windsurf

dan alat coding AI lainnya

Ganti semua ikon di proyek dengan yang trendi

atau gaya lainnya

Tambahkan ikon ke semua daftar poin dan blok fitur,

langkah proses, navigasi, dll.

Demo yang dibuat dengan Icons8 MCP

Gaya Emoji · 36 ikon

29 ikon, disisipkan sebagai SVG

10 ikon, satu gaya outline

Gaya Color · 27 ikon

Cara menggunakan Icons8 MCP

Yang Anda perlukan

• Claude Code, Codex, Cursor, Windsurf, VS Code, atau alat coding AI sejenis
• Node.js untuk jalur plugin di Claude Code dan Codex: server bawaan berjalan melalui npx mcp-remote. Konfigurasi manual untuk Cursor, Windsurf, dan VS Code berbicara HTTP secara langsung, jadi tidak perlu menginstal apa pun

Langkah 1: hubungkan Icons8

Claude Code

Codex

Cursor

Windsurf

VS Code

Lainnya

Satu baris di terminal Anda menginstal server MCP dan skill icons8 sekaligus:

claude plugin marketplace add icons8/agent-skills && claude plugin install icons8@icons8

Salin kode

Setujui server pada penggunaan pertama, lalu periksa dengan /mcp. Itu saja pengaturannya.

Lebih suka tetap di dalam Claude Code? Kedua perintah ini melakukan hal yang sama:

/plugin marketplace add icons8/agent-skills

Salin kode

/plugin install icons8@icons8

Salin kode

Apa yang ditambahkan oleh skill icons8

• Satu gaya per proyek, disimpan ke icons8.json. Commit file tersebut, dan sesi berikutnya tetap menggunakan gaya yang sama alih-alih memilih gaya baru.
• Gear polos untuk pengaturan, bukan logo merek yang berbagi nama yang sama.
• Pratinjau PNG gratis selama Anda mengulang, SVG hanya untuk set yang Anda setujui.

MCP memberi agen Anda katalog, skill memberi agen aturan. Tanpa itu, agen mengambil hasil pencarian pertama untuk setiap label, dan itulah cara satu layar berakhir dengan ikon dari empat gaya berbeda. Open source di bawah Apache-2.0: github.com/icons8/agent-skills.

Langkah 2: buka kunci SVG saat Anda membutuhkannya

Semua yang di atas sudah berfungsi: pencarian, pratinjau PNG, PNG resolusi tinggi di ukuran apa pun. SVG adalah format produksi, dan memerlukan kunci.

Kunci tersebut membuka alat kelima, get_icon_svg: SVG asli untuk gaya apa pun di katalog, menskalakan dengan bersih dan mengikuti warna teks. PNG tetap gratis dengan tautan balik ke Icons8. Berlangganan seharga $15, lalu ambil kode pengaturan siap pakai dari tab MCP di akun Anda: kode tersebut sudah terisi dengan kunci Anda. Atau tambahkan kunci ke konfigurasi mana pun secara manual:

{ "mcpServers": { "icons8mcp-svg": { "type": "http", "url": "https://mcp.icons8.com/mcp/", "headers": { "Authorization": "Bearer YOUR_API_KEY" } } } }

Salin kode

Di Claude Code, hal yang sama dilakukan dengan satu perintah:

claude mcp add --transport http icons8mcp-svg https://mcp.icons8.com/mcp/ --header "Authorization: Bearer YOUR_API_KEY"

Salin kode

Periksa apakah kunci sudah berhasil: jalankan claude mcp list. Lima alat berarti kunci sudah tiba, dan alat kelima adalah get_icon_svg. Empat alat berarti header tidak mencapai server.

Sudah menginstal plugin di Langkah 1? Maka server Anda adalah server bawaan tanpa kunci, jadi SVG tetap terkunci apa pun yang Anda minta. Tambahkan server dengan kunci di atas: keduanya berjalan berdampingan, alat PNG hanya muncul dua kali, dan Anda dapat menonaktifkan server tanpa kunci di klien Anda.

Langkah 3: dapatkan ikon ke proyek Anda

Minta apa yang Anda butuhkan. Sebutkan gaya jika Anda sudah punya gaya tertentu, dan jika belum, minta untuk melihat beberapa gaya dulu: pratinjau PNG gratis dan tidak memerlukan kunci, jadi membandingkan tidak memakan biaya apa pun.

• "Tunjukkan saya ikon pengaturan dalam enam gaya Icons8 yang berbeda sebagai pratinjau PNG, dan beri tahu saya nama masing-masing gaya."
• "Buat layar pengaturan. Ikon dari Icons8, Material Outlined, 24px."
• "Ganti setiap ikon di proyek ini ke Flat Color dan pertahankan ukuran saat ini."
• "Tambahkan ikon ke enam blok fitur di halaman arahan, satu gaya, 48px."

Mendeskripsikan tampilan juga berfungsi: "outline tipis, tanpa warna, 24px", "flat color untuk halaman arahan", "gambar tangan". Skill menyimpan gaya apa pun yang dipilih agen Anda ke icons8.json, sehingga sesi berikutnya otomatis mempertahankannya. Semua 130 gaya dapat dijelajahi di icons8.com/icons.

Tiga hal yang layak dimasukkan ke dalam prompt

• Gaya. Sebutkan sekali, skill menguncinya di icons8.json untuk seluruh proyek. Id bersifat spesifik per gaya, jadi mengubah gaya di kemudian hari berarti memilih ulang setiap ikon.
• Ukuran. Setiap gaya digambar untuk satu ukuran, dari glyph 16px hingga scene warna 64px. Tanyakan agen Anda ukuran gaya yang Anda pilih digambar untuk, dan gunakan ukuran itu atau dua kali lipatnya. Ikon 50px yang diperkecil menjadi 16px kehilangan detail yang membuatnya terbaca.
• Format. Pratinjau PNG gratis dan instan, jadi ulangi dengan PNG dan minta SVG setelah set final. SVG memerlukan kunci, lihat Langkah 2.

Berikut layar yang sama dibuat dua kali: di kiri tidak ada gaya yang disebutkan, jadi agen mengambil hasil pertama untuk setiap label. Di kanan satu gaya disebutkan untuk seluruh layar.

Tidak ada gaya yang disebutkan

Ikon datang dari empat gaya berbeda: logo merek untuk Pengaturan, avatar full color di sidebar monokrom, emoji untuk status.

Material Outlined, 24px

18 ikon, satu ketebalan stroke, satu tampilan. Setiap ikon mengikuti warna teks, jadi mode gelap dan theming datang gratis.

Lihat demo langsung untuk inspirasi. Jika ada yang tidak berfungsi, lihat FAQ.

Pertanyaan yang sering diajukan

Bagaimana jika muncul pesan "No API key"?

Berlangganan seharga $15, temukan tab MCP di akun Icons8 Anda untuk kode pengaturan. Alternatifnya, dapatkan kunci API dari portal pengembang Icons8.

Bagaimana cara mempertahankan satu gaya ikon di seluruh proyek?

Skill icons8 dari Langkah 1 melakukan ini untuk Anda: skill memilih satu paket untuk seluruh proyek dan menguncinya di icons8.json. Commit file tersebut, dan sesi berikutnya, atau agen lain, tetap menggunakan gaya yang sama. Tanpa skill, sebutkan gaya di prompt pertama Anda dan ulangi setiap kali Anda menambahkan ikon di kemudian hari. Id bersifat spesifik per gaya: ikon yang sama memiliki id berbeda di setiap gaya, jadi mengubah gaya di kemudian hari berarti memilih ulang setiap ikon.

Format apa yang saya dapatkan?

SVG (dengan kunci API), pratinjau PNG tersedia untuk semua pengguna.

Bisakah saya mengunduh ikon PNG dengan server MCP secara gratis?

Ya, pratinjau ikon PNG tersedia tanpa kunci API saat Anda terhubung ke server Icons8 MCP.

Apa persyaratan lisensi untuk versi gratis?

Semua ikon PNG yang diunduh melalui MCP gratis digunakan jika Anda memberikan tautan balik ke kami, termasuk di produksi. Periksa lisensi kami di sini. Untuk aset yang menskalakan di UI produksi, gunakan SVG dengan kunci API.

Apakah ini open source?

Skill dan plugin adalah Apache-2.0 di GitHub, dan daftar skills.sh lulus audit keamanan Socket, Snyk, dan Gen Agent Trust Hub. Ikon-ikon itu sendiri dilisensikan secara terpisah: gratis dengan atribusi, SVG di paket berbayar.

Apakah saya perlu kunci API?

PNG berfungsi tanpa kunci, unduhan SVG memerlukan kunci API berbayar, temukan di tab MCP akun Anda.

Saya meminta SVG tetapi masih mendapatkan PNG

Jalankan claude mcp list dan hitung alatnya. Empat berarti kunci tidak mencapai server, jadi periksa header Authorization di konfigurasi Anda, atau salin yang sudah siap dari tab MCP. Lima alat dan masih PNG: sebutkan format di prompt, dan jika Anda menginstal plugin, pastikan agen Anda menggunakan server dengan kunci dan bukan server bawaan tanpa kunci.

Ukuran ikon apa yang harus saya minta?

Ukuran yang digambar untuk gaya tersebut: 16px untuk Simple Small, 24px untuk Material dan Windows 11, 30 hingga 50px untuk iOS, 48px ke atas untuk gaya warna. Detail hilang ketika gaya besar digunakan kecil. Agen Anda dapat memberi tahu Anda ukuran yang digambar untuk gaya apa pun.

Bisakah saya mengunduh ikon secara batch?

Belum, tapi inilah fitur yang sedang kami kerjakan secara aktif saat ini.

Apakah ini berfungsi dengan OpenAI Codex?

Ya. Jalankan codex mcp add icons8mcp --url https://mcp.icons8.com/mcp/, lalu tambahkan skill dengan npx skills add icons8/agent-skills --skill icons8. Untuk SVG, arahkan Codex ke kunci Anda dengan --bearer-token-env-var, lihat Langkah 2.

Butuh bantuan?

Periksa dokumentasi kami atau ngobrol dengan kami.