Yapay zekayla logo yapıyorum ama şöyle slop oluyor, böyle kötü oluyor diyorsan gel...
Bu aracın içinde 1400'den fazla görsel referans var. Bu sayede birbirine benzemeyen tertemiz logolar çıkartıyorsun :D
Aha da repo'nun linki:
kaankiziltug/logo-design-skill t.co
20 likes · 959 views
7 GitHub repos for the ULTIMATE Design AI
Seven open source repos that between them cover most of what a design department does, from reading a competitor's site to shipping the prototype. Every one is free and runs on your own machine, and together they carry over 436,000 GitHub stars.
KyoubeAI: KyoubeAI/KyoubeAI
CHAPTERS
0:00 Intro
0:12 The lineup
0:38 1. designlang
1:12 2. logo-design-skill
1:50 3. awesome-design-md
2:28 4. Hallmark
3:11 5. Impeccable
3:52 6. diagram-design
4:26 7. OpenDesign
5:03 Who it's for
5:29 All linked
THE SEVEN REPOS
1. designlang (4,412 stars, MIT)
Manavarya09/design-extract
Reads any website's design system off the live page.
2. logo-design-skill (5,154 stars, MIT)
kaankiziltug/logo-design-skill
Takes a logo from the brief to production-ready SVG.
3. awesome-design-md (124,388 stars, MIT)
VoltAgent/awesome-design-md
Ready-made DESIGN.md files your agent builds from.
4. Hallmark (41,429 stars, MIT)
Nutlope/hallmark
Builds new pages that don't look AI-generated.
5. Impeccable (94,097 stars, Apache-2.0)
pbakaus/impeccable
Design words, a reviewer and a slop detector for your agent.
6. diagram-design (62,675 stars, MIT)
cathrynlavery/diagram-design
On-brand diagrams as one HTML file.
7. OpenDesign (104,778 stars, Apache-2.0)
nexu-io/open-design
A local-first design studio driven by the agent you already use.
Made with HyperFrames: heygen-com/hyperframes
If this video helped you, do subscribe.
#AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign
[de-DE] 7 GitHub-Repos für die ULTIMATIVE Design-KI
Sieben Open-Source-Repositories decken zusammen fast alle Aufgaben einer Designabteilung ab – von der Analyse der Konkurrenz bis zum Prototypenversand. Alle sind kostenlos und laufen auf Ihrem eigenen Rechner. Zusammen verzeichnen sie über 436.000 GitHub-Sterne.
KyoubeAI: KyoubeAI/KyoubeAI
KAPITEL
0:00 Einleitung
0:12 Die Liste
0:38 1. designlang
1:12 2. logo-design-skill
1:50 3. awesome-design-md
2:28 4. Hallmark
3:11 5. Impeccable
3:52 6. diagram-design
4:26 7. OpenDesign
5:03 Für wen ist es gedacht?
5:29 Alle verlinkten Repositories
DIE SIEBEN REPOS
1. designlang (4.412 Sterne, MIT-Lizenz)
Manavarya09/design-extract
Liest das Designsystem jeder Website von der Live-Seite aus.
2. logo-design-skill (5.154 Sterne, MIT)
kaankiziltug/logo-design-skill
Erstellt aus einem Briefing ein produktionsfertiges SVG-Logo.
3. awesome-design-md (124.388 Sterne, MIT)
VoltAgent/awesome-design-md
Vorgefertigte DESIGN.md-Dateien für Ihren Agenten.
4. Hallmark (41.429 Sterne, MIT)
Nutlope/hallmark
Erstellt neue Seiten, die nicht KI-generiert aussehen.
5. Impeccable (94.097 Sterne, Apache-2.0)
pbakaus/impeccable
Entwurfstexte, ein Korrekturleser und ein Fehlerdetektor für Ihren Agenten.
6. diagram-design (62.675 Sterne, MIT-Lizenz)
cathrynlavery/diagram-design
Markenkonforme Diagramme in einer einzigen HTML-Datei.
7. OpenDesign (104.778 Sterne, Apache-2.0)
nexu-io/open-design
Ein lokales Designstudio, das mit Ihrem gewohnten Agenten arbeitet.
Erstellt mit HyperFrames: heygen-com/hyperframes
Hat Ihnen dieses Video geholfen? Dann abonnieren Sie unseren Kanal!
#KIdesign #OpenSource #GitHub #KIagenten #ClaudeCode #Selbstgehostet #UIDesign
[es-US] 7 repos de GitHub para la IA de diseño DEFINITIVA
Siete repositorios de código abierto que, en conjunto, abarcan la mayor parte del trabajo de un departamento de diseño, desde analizar el sitio web de la competencia hasta lanzar el prototipo. Todos son gratuitos y se ejecutan en tu propio ordenador, y en conjunto suman más de 436.000 estrellas en GitHub.
KyoubeAI: KyoubeAI/KyoubeAI
CAPÍTULOS
0:00 Introducción
0:12 Lista de herramientas
0:38 1. designlang
1:12 2. logo-design-skill
1:50 3. awesome-design-md
2:28 4. Hallmark
3:11 5. Impeccable
3:52 6. diagram-design
4:26 7. OpenDesign
5:03 Para quién es
5:29 Enlaces
LOS SIETE REPOSITORIOS
1. designlang (4412 estrellas, MIT)
Manavarya09/design-extract
Lee el sistema de diseño de cualquier sitio web directamente desde la página.
2. logo-design-skill (5154 estrellas, MIT)
kaankiziltug/logo-design-skill
Transforma un logotipo, desde el briefing hasta un archivo SVG listo para producción.
3. awesome-design-md (124 388 estrellas, MIT)
VoltAgent/awesome-design-md
Archivos DESIGN.md predefinidos que tu agente puede usar para crear sus páginas.
4. Hallmark (41 429 estrellas, MIT)
Nutlope/hallmark
Crea páginas nuevas con un aspecto natural, sin parecer generadas por IA.
5. Impeccable (94 097 estrellas, Apache-2.0)
pbakaus/impeccable
Diseña textos, un revisor y un detector de errores para tu agente.
6. diagram-design (62.675 estrellas, MIT)
cathrynlavery/diagram-design
Diagramas personalizados en un solo archivo HTML.
7. OpenDesign (104.778 estrellas, Apache-2.0)
nexu-io/open-design
Un estudio de diseño local impulsado por el agente que ya utilizas.
Creado con HyperFrames: heygen-com/hyperframes
Si este video te fue útil, suscríbete.
#DiseñoIA #códigoabierto #github #AgentesIA #ClaudeCode #autoalojado #diseñoUI
[fr-FR] 7 dépôts GitHub pour l'IA de design ULTIME
Sept dépôts open source qui, ensemble, couvrent la plupart des tâches d'un bureau d'études, de l'analyse du site concurrent à la livraison du prototype. Chacun est gratuit et s'exécute sur votre machine. Ils cumulent plus de 436 000 étoiles sur GitHub.
KyoubeAI : KyoubeAI/KyoubeAI
CHAPITRES
0:00 Introduction
0:12 Présentation des outils
0:38 1. designlang
1:12 2. logo-design-skill
1:50 3. awesome-design-md
2:28 4. Hallmark
3:11 5. Impeccable
3:52 6. diagram-design
4:26 7. OpenDesign
5:03 À qui s'adresse cet outil ?
5:29 Tous les liens sont disponibles
LES SEPT DÉPÔTS
1. designlang (4 412 étoiles, MIT)
Manavarya09/design-extract
Extrait le système de conception de n'importe quel site web directement depuis la page.
2. logo-design-skill (5 154 étoiles, licence MIT)
kaankiziltug/logo-design-skill
Transforme un logo, du brief au fichier SVG prêt pour la production.
3. awesome-design-md (124 388 étoiles, licence MIT)
VoltAgent/awesome-design-md
Fichiers DESIGN.md prêts à l'emploi pour votre agent.
4. Hallmark (41 429 étoiles, licence MIT)
Nutlope/hallmark
Crée des pages web au design naturel, sans effet artificiel.
5. Impeccable (94 097 étoiles, licence Apache-2.0)
pbakaus/impeccable
Outils de conception, de relecture et de détection d'erreurs pour votre agent.
6. diagram-design (62 675 étoiles, MIT)
cathrynlavery/diagram-design
Des diagrammes conformes à votre charte graphique, regroupés dans un seul fichier HTML.
7. OpenDesign (104 778 étoiles, Apache-2.0)
nexu-io/open-design
Un studio de design optimisé pour une utilisation locale, piloté par l'agent que vous utilisez déjà.
Développé avec HyperFrames : heygen-com/hyperframes
Si cette vidéo vous a été utile, abonnez-vous !
#AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign
[hi] अल्टीमेट डिज़ाइन AI के लिए 7 GitHub रिपोज़
ये सात ओपन सोर्स रिपॉजिटरी डिज़ाइन विभाग के लगभग सभी कार्यों को कवर करती हैं, जिनमें प्रतिस्पर्धी वेबसाइट का अध्ययन करने से लेकर प्रोटोटाइप तैयार करने तक शामिल है। ये सभी निःशुल्क हैं और आपके कंप्यूटर पर चलती हैं, और इन सभी को मिलाकर GitHub पर 436,000 से अधिक स्टार मिले हैं।
KyoubeAI: KyoubeAI/KyoubeAI
अध्याय
0:00 परिचय
0:12 मुख्य भाग
0:38 1. डिज़ाइनलैंग
1:12 2. लोगो-डिज़ाइन-कौशल
1:50 3. ऑसम-डिज़ाइन-एमडी
2:28 4. हॉलमार्क
3:11 5. इम्पेकेबल
3:52 6. डायग्राम-डिज़ाइन
4:26 7. ओपनडिज़ाइन
5:03 किसके लिए
5:29 सभी लिंक
सात रिपॉज़िटरी
1. डिज़ाइनलैंग (4,412 स्टार, MIT)
Manavarya09/design-extract
लाइव पेज से किसी भी वेबसाइट के डिज़ाइन सिस्टम को पढ़ता है।
2. लोगो-डिज़ाइन-स्किल (5,154 स्टार, MIT)
kaankiziltug/logo-design-skill
यह लोगो को ब्रीफ से प्रोडक्शन-रेडी SVG में बदलता है।
3. ऑसम-डिज़ाइन-एमडी (124,388 स्टार, MIT)
VoltAgent/awesome-design-md
तैयार DESIGN.md फ़ाइलें जिनसे आपका एजेंट बिल्ड करता है।
4. हॉलमार्क (41,429 स्टार, MIT)
Nutlope/hallmark
ऐसे नए पेज बनाता है जो AI जनरेटेड नहीं लगते।
5. इम्पेकेबल (94,097 स्टार, Apache-2.0)
pbakaus/impeccable
आपके एजेंट के लिए डिज़ाइन शब्द, एक समीक्षक और एक स्लोप डिटेक्टर।
6. डायग्राम-डिज़ाइन (62,675 स्टार, MIT)
cathrynlavery/diagram-design
ब्रांड के अनुरूप डायग्राम एक HTML फ़ाइल में।
7. ओपनडिज़ाइन (104,778 स्टार, Apache-2.0)
nexu-io/open-design
एक स्थानीय-केंद्रित डिज़ाइन स्टूडियो, जो आपके पहले से उपयोग किए जा रहे एजेंट द्वारा संचालित है।
हाइपरफ्रेम्स के साथ बनाया गया: heygen-com/hyperframes
अगर इस वीडियो से आपको मदद मिली, तो सब्सक्राइब करें।
#AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign
[id] 7 Repo GitHub untuk AI Desain TERBAIK
Tujuh repositori sumber terbuka yang mencakup sebagian besar pekerjaan departemen desain, mulai dari membaca situs pesaing hingga mengirimkan prototipe. Semuanya gratis dan dapat dijalankan di mesin Anda sendiri, dan secara keseluruhan memiliki lebih dari 436.000 bintang GitHub.
KyoubeAI: KyoubeAI/KyoubeAI
BAB
0:00 Pendahuluan
0:12 Daftar pustaka
0:38 1. designlang
1:12 2. logo-design-skill
1:50 3. awesome-design-md
2:28 4. Hallmark
3:11 5. Impeccable
3:52 6. diagram-design
4:26 7. OpenDesign
5:03 Untuk siapa pustaka ini
5:29 Semua pustaka terhubung
TUJUH REPOSITORI
1. designlang (4.412 bintang, MIT)
Manavarya09/design-extract
Membaca sistem desain situs web apa pun dari halaman langsung.
2. logo-design-skill (5.154 bintang, MIT)
kaankiziltug/logo-design-skill
Mengubah logo dari brief menjadi SVG siap produksi.
3. awesome-design-md (124.388 bintang, MIT)
VoltAgent/awesome-design-md
File DESIGN.md siap pakai yang dapat digunakan agen Anda untuk membangun halaman.
4. Hallmark (41.429 bintang, MIT)
Nutlope/hallmark
Membangun halaman baru yang tidak terlihat seperti hasil buatan AI.
5. Impeccable (94.097 bintang, Apache-2.0)
pbakaus/impeccable
Mendesain kata-kata, peninjau, dan pendeteksi kesalahan untuk agen Anda.
6. diagram-design (62.675 bintang, MIT)
cathrynlavery/diagram-design
Diagram yang sesuai dengan merek sebagai satu file HTML.
7. OpenDesign (104.778 bintang, Apache-2.0)
nexu-io/open-design
Studio desain yang mengutamakan lokal dan digerakkan oleh agen yang sudah Anda gunakan.
Dibuat dengan HyperFrames: heygen-com/hyperframes
Jika video ini membantu Anda, silakan berlangganan.
#AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign
[it] 7 repository GitHub per l'AI di design DEFINITIVA
Sette repository open source che, nel loro insieme, coprono la maggior parte delle attività di un reparto di design, dalla lettura del sito di un concorrente alla realizzazione del prototipo. Ognuno di essi è gratuito e funziona sul proprio computer, e insieme vantano oltre 436.000 stelle su GitHub.
KyoubeAI: KyoubeAI/KyoubeAI
CAPITOLI
0:00 Introduzione
0:12 La lista
0:38 1. designlang
1:12 2. logo-design-skill
1:50 3. awesome-design-md
2:28 4. Hallmark
3:11 5. Impeccable
3:52 6. diagram-design
4:26 7. OpenDesign
5:03 A chi è rivolto
5:29 Tutti i link
I SETTE REPOSITORY
1. designlang (4.412 stelle, MIT)
Manavarya09/design-extract
Legge il design system di qualsiasi sito web direttamente dalla pagina.
2. logo-design-skill (5.154 stelle, MIT)
kaankiziltug/logo-design-skill
Trasforma un logo, a partire dal brief, in un file SVG pronto per la produzione.
3. awesome-design-md (124.388 stelle, MIT)
VoltAgent/awesome-design-md
File DESIGN.md predefiniti che il tuo agente può utilizzare per creare le tue pagine.
4. Hallmark (41.429 stelle, MIT)
Nutlope/hallmark
Crea nuove pagine che non sembrano generate dall'IA.
5. Impeccable (94.097 stelle, Apache-2.0)
pbakaus/impeccable
Testo di progettazione, strumento di revisione e rilevatore di errori per il tuo agente.
6. diagram-design (62.675 stelle, MIT)
cathrynlavery/diagram-design
Diagrammi in linea con il brand in un unico file HTML.
7. OpenDesign (104.778 stelle, Apache-2.0)
nexu-io/open-design
Uno studio di design incentrato sull'ambiente locale, basato sull'agente che già utilizzi.
Realizzato con HyperFrames: heygen-com/hyperframes
Se questo video ti è stato utile, iscriviti al canale.
#AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign
[pt-BR] 7 repositórios do GitHub para a IA de Design DEFINITIVA
Sete repositórios de código aberto que, juntos, abrangem a maior parte das atividades de um departamento de design, desde a análise do site de um concorrente até o envio do protótipo. Todos são gratuitos e funcionam em sua própria máquina, e juntos somam mais de 436.000 estrelas no GitHub.
KyoubeAI: KyoubeAI/KyoubeAI
CAPÍTULOS
0:00 Introdução
0:12 A lista de projetos
0:38 1. designlang
1:12 2. logo-design-skill
1:50 3. awesome-design-md
2:28 4. Hallmark
3:11 5. Impeccable
3:52 6. diagram-design
4:26 7. OpenDesign
5:03 Para quem é indicado
5:29 Todos os projetos estão linkados
OS SETE REPOSITÓRIOS
1. designlang (4.412 estrelas, MIT)
Manavarya09/design-extract
Lê o sistema de design de qualquer site diretamente da página.
2. logo-design-skill (5.154 estrelas, MIT)
kaankiziltug/logo-design-skill
Transforma um briefing em um logotipo pronto para produção em SVG.
3. awesome-design-md (124.388 estrelas, MIT)
VoltAgent/awesome-design-md
Arquivos DESIGN.md prontos para uso que seu agente utiliza.
4. Hallmark (41.429 estrelas, MIT)
Nutlope/hallmark
Cria novas páginas que não parecem geradas por IA.
5. Impeccable (94.097 estrelas, Apache-2.0)
pbakaus/impeccable
Textos de design, um revisor e um detector de erros para seu agente.
6. diagram-design (62.675 estrelas, MIT)
cathrynlavery/diagram-design
Diagramas personalizados em um único arquivo HTML.
7. OpenDesign (104.778 estrelas, Apache-2.0)
nexu-io/open-design
Um estúdio de design local, baseado no agente que você já usa.
Feito com HyperFrames: heygen-com/hyperframes
Se este vídeo te ajudou, inscreva-se no canal.
#AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign
4 likes · 100 views
@lepture 昨天尝试做图标,直接提示效果很差,后来用了 kaankiziltug/logo-design-skill 好不错。
2 likes · 235 views
Logo Design Skill: AI Logo Designer for Claude
---
title: "Logo Design Skill: AI Logo Designer for Claude"
published: true
tags: opensource, ai, claudecode, aiagents
canonical_url: devpik.com
---
Logo Design Skill is a free, MIT-licensed agent skill that turns Claude or any Agent Skills agent into a logo designer: a brief-to-checkpoint workflow, 1,400+ visually classified reference logos, dependency-free Python audit and export tools, and production-ready SVG output.
What Logo Design Skill Actually Is
Ask an AI agent for a logo and you usually get clip art with your company name under it: a swoosh, a lightbulb, a hexagon that means nothing. Logo Design Skill exists to stop that.
It is a free, MIT-licensed skill that turns Claude, or any agent that supports the open Agent Skills format (Gemini CLI, Codex CLI, Cursor, GitHub Copilot and more), into a disciplined identity designer that works from the first brief to production-ready SVG files and brand guidelines. The repository was created on 26 September 2026 and passed 1,400 stars within its first week on GitHub.
Nothing here runs as an app. The skill ships as a SKILL.md file, a shelf of reference documents and dependency-free Python tools that your agent loads as standing instructions. A note on the GitHub language label, which says HTML: the substance is markdown and Python, and the HTML label comes from the local gallery page that browses the reference library. Clone this expecting a web project and you will find a design school for your agent instead.
The Problem: AI Logos All Look the Same
Every category has its clichés, and AI agents reach for them first. Food delivery gets a fork, a chef hat or a scooter. Security gets a padlock or a shield. Health gets a cross or a heartbeat line. The README's briefs read like a banned-symbols list on purpose: Kiln, a specialty coffee roaster, is told "not rustic cliché"; Keyfort, a password manager, gets "no padlocks, shields, keyholes, fingerprints or chain links"; Mediora, a telehealth app, gets "no crosses, stethoscopes, hearts or pulse lines".
The skill's first move is research: it searches its 1,400-logo reference library to map what the category already looks like, so the concepts it builds can avoid both the clichés and accidental look-alikes. That step alone separates it from a prompt that says "design a modern logo" and hopes.
The second move is craft that most people never see. Logo work lives in details like optical corrections (overshoot, the bone effect, irradiation), geometric construction and snapping diagonals to exact angles. The skill's audit caught a 60.8° diagonal in an early concept and an off-centre symbol before anything was shown to the client. Our Color Converter is the tool you will reach for when the skill hands you a brand palette and you need it in hex, RGB and HSL without thinking.
How It Works: From Brief to Checkpoint
The skill runs a fixed pipeline, and each stage has a job.
- Brief: the agent starts from your stated assumptions or runs a discovery question bank: word mapping, choosing the right mark type (wordmark, letterform, pictorial, abstract, emblem, mascot and the rest), and a decision guide for which fits.
- Research: it queries the reference library for the category, studying construction and conventions, and checking that its ideas do not echo an existing mark.
- Concepts: 8 to 12 one-line ideas, of which 3 get built in SVG.
- Test and refine: every concept goes through svg_audit.py and a test sheet before you ever see it: 96 and 32 px side by side, one-colour and reversed versions, then a size ladder down to 16 px, plus backgrounds, treatments, contexts and a competitor shelf test.
The reference documents cover the full discipline on demand: the twelve principles, mark types, visual techniques (geometry, grids, balance, optical corrections, negative space), colour, typography, the design process, SVG construction, a testing checklist, presentation and delivery, identity systems, redesigns and critique. The agent loads what the task needs and nothing else, which keeps the context lean.
The Checkpoint Is the Whole Point
The skill always stops at the checkpoint. It shows the concepts as one overview image with a recommendation and offers the full kit. Nothing else is produced until you choose a direction, because the kit (colour, lockups, presentation board, icons, guidelines) is most of the work and only makes sense for an approved idea.
This is the design decision that makes the whole thing work. An agent left to run end to end will polish the wrong idea beautifully. Forcing a human decision at the concept stage is what keeps the labour pointed at the right target.
The 28 example brands prove the checkpoint earns its place. In four of them the client picked a different concept than the one the skill recommended, and the skill refined that choice before colouring it: Tinkertrail's client took the letterform over the recommended snail because it reads at 16 px; Hearsay's client took the pull-up chair over the recommended ear. That is exactly what the checkpoint is for. A recommendation you cannot overrule is not a recommendation.
A 1,400-Logo Reference Library, Visually Classified
The library is the skill's unfair advantage. More than 1,400 SVG files covering roughly 1,200 brands, each visually classified by mark type, technique, geometry, subject, typography, mood and industry. The breakdown reads like a design textbook's table of contents: abstract 24%, combination 21%, pictorial 20%, letterform 15%, wordmark 10%, emblem 4%, mascot 4%, lettermark 3%. Median 2 colours, three quarters of the library uses 3 or fewer, gradients appear in 19%, and 141 files are flagged as exemplary teaching examples.
It is searchable from the command line (python3 scripts/search_library.py --technique negative-space --exemplary, or --industry payments-fintech --summary) and browsable in a local gallery page. The stated purpose is study: learn construction, map category conventions, avoid look-alikes. Never to copy. The library guide says it plainly, and the TRADEMARKS.md file draws the legal line (more on that in the limitations section).
For comparison of scale in this ecosystem, Anti-Slop ships a rulebook where this ships a school. Both are agent skills; one filters output, the other teaches craft.
The Tools: Audits, Test Sheets, Boards, Icon Export
Everything is plain Python with no dependencies beyond the standard library (Python 3.8+), so the tools run anywhere your agent runs.
- svg_audit.py turns craft rules into checks: viewBox and aspect, colour count, anchor points against library medians, near-miss angles, tiny details under 1/48 of the canvas, centring. It ends with a production-readiness score out of 100. The README's own example scores a recommended lockup at 99 and a rejected emblem at 76, with the warnings spelled out.
- preview_sheet.py builds an HTML test sheet: sizes, backgrounds, treatments, contexts and the competitor shelf test.
- concept_sheet.py renders the one-image concept overview the checkpoint shows you.
- presentation_board.py builds client presentation boards with six industry-specific mockups per concept.
- render_png.py and export_variants.py take the final SVG to transparent PNGs at exact sizes, a favicon.ico, black/white/mono/square variants and the complete favicon, app-icon and web-manifest set.
PNG and ICO export uses whatever renderer is available: cairosvg, rsvg-convert, Inkscape, a Chromium-based browser or macOS Quick Look. If you hand-edit the exported SVG afterwards, running it through an HTML minifier keeps the file lean, and embedding it as a data URI is a one-liner with Base64 encode.
28 Example Brands, Run End to End
Twenty-eight fictional briefs, from quiet luxury and neon festivals to B2B SaaS, fintech and health, each run end to end with the skill. For every brand you see exactly what the skill shows at the checkpoint (greyscale concepts at true 64, 32 and 16 px sizes plus a recommendation), followed by a colour preview of the chosen direction on mockups picked for that industry.
A few of the strongest: Kiln, a specialty coffee roaster, where the recommended mark is a K whose leg is the kiln's arched firing mouth, with the arch returning as the n of the wordmark. Zestly, a food delivery app, where a citrus wedge flips into a cheeky grinning face, and the skill flags its own honest risk: some people read the wedge as watermelon. Maison Orvelle, a luxury fashion atelier, where a Didone M holds an O like a pendant at a V-neckline, and the craft pass killed an M-in-a-circle for sitting too close to a famous transit sign. Keyfort, a password manager, where one unbroken wall winds inward into a Greek key that is also a fortress with only one way in.
The later batches deliberately push vivid, saturated palettes while still passing the one-colour and 3:1 contrast checks, which is the hard combination. Colour that only survives at full saturation is decoration; colour that survives one-colour is identity.
Getting Started in One Command
Claude Code users get the recommended route, a plugin marketplace install:
/plugin marketplace add kaankiziltug/logo-design-skill
/plugin install logo-design@logo-design-skill
Manual install is a copy: git clone https://github.com/kaankiziltug/logo-design-skill.git then cp -r logo-design-skill/skills/logo-design ~/.claude/skills/logo-design for personal use (or .claude/skills/logo-design per project). Claude.ai and Claude Desktop users download logo-design.zip from the Releases page and upload it under Settings, Capabilities, Skills; if the upload has a size limit, logo-design-lite.zip carries everything except the SVG files themselves.
Gemini CLI, Codex CLI and other agents use the open Agent Skills format, so it is the same drill: clone once, copy the folder into your agent's skills directory (~/.gemini/skills/logo-design, ~/.codex/skills/logo-design, and so on), start a new session and ask.
Then just ask, in plain language:
> "Design a logo for Harbor, a savings app for first-time savers. It should feel calm and safe."
> "Here's our current logo (logo.svg), critique it and suggest a refresh."
> "Give me three wordmark directions for a specialty coffee roaster called Kiln."
> "Turn this symbol into favicon, app icon and one-colour versions, plus a one-page usage guide."
Two operational notes. The skill works best with a model that can view images, because it renders its own drafts to PNG and checks them before showing you anything. And like all skills, it loads at session start, so open a new session after installing.
The Honest Limitation: Trademarks Are Not MIT, and It Needs Eyes
Two caveats, both stated in the repository itself.
First, the license split. The skill text, scripts, templates and catalog data are MIT. The 1,400 SVG logo files in assets/library/svg/ are trademarks of their respective owners, included for reference and education only, and are not covered by the MIT license. Study them, learn from them, do not ship them. The skill is built to prevent copying, but the legal responsibility for what you publish stays yours.
Second, vision matters. The skill renders its own drafts to PNG and checks them before showing you anything, which is how it catches things like a letterform that reads as a different letter at 16 px. That loop only closes with a model that can view images. Run it on a text-only model and you still get the SVGs and the written reasoning, but you lose the self-review pass, and the self-review is where half the craft lives.
The broader limitation is the honest one for any design tool: it executes a process with unusual discipline, but the brief is still yours to write well. A vague brief gets you disciplined clichés.
Repo Health: 1,400 Stars in a Week
The repository was created on 26 September 2026 and passed 1,400 stars with 79 forks in under a week; the latest push landed on 30 September, two days before this page went up. It carries a badge for #14 on The New 100 agent leaderboard, and the test suite runs on every push via GitHub Actions.
The growth curve is the usual early hockey stick, which is either a community forming or a trend passing, and a week is too early to say which. The durable signals: the documentation is enormous and specific (the README alone runs close to 500 lines), the tools are dependency-free and tested, the 28 worked examples show the process rather than describing it, and the project is unusually willing to state what it will not do.
Good fit if you need a real logo for a side project, startup or open-source tool and want actual craft (geometry, optical corrections, testing at 16 px) instead of clip art with your name under it.
Poor fit if what you need is a human designer's taste, negotiation and accountability, or you were hoping to lift marks out of the reference library. It is built to stop exactly that.
FAQ
Is Logo Design Skill really free?
Yes. The skill text, scripts, templates and catalog data are MIT-licensed with no paid tier. The 1,400 reference SVG logo files are trademarks of their respective owners and are included for reference and education only, not covered by the MIT license.
Which AI agents does it work with?
Any agent that supports the open Agent Skills format: Claude Code (the plugin marketplace route is recommended), Claude.ai and Claude Desktop, Gemini CLI, Codex CLI, Cursor, GitHub Copilot and OpenCode. The instructions are plain Markdown and the tools are plain Python with no dependencies.
Do I need design experience to use it?
No. The skill runs the full process itself: discovery questions, word mapping, category research, concepting and testing, then stops at a checkpoint with a recommendation. You pick a direction and ask for the kit. A good brief helps, but the skill will interrogate you for one.
How do I install it in Claude Code?
Run /plugin marketplace add kaankiziltug/logo-design-skill, then /plugin install logo-design@logo-design-skill. Or manually: git clone the repository and copy skills/logo-design into ~/.claude/skills/. Start a new session afterwards, because skills only load at session start.
Can it critique my existing logo?
Yes. The skill triggers on critique requests, and its svg_audit.py tool scores any SVG against logo principles: anchor-point complexity, colour count, near-miss angles, tiny details and centring, ending with a production-readiness score out of 100.
Why does it need a model that can view images?
Because it renders its own drafts to PNG and checks them before showing you anything. That self-review loop is how it catches problems like a letterform that reads as a different letter at 16 px. On a text-only model you still get the SVG and the written reasoning, but you lose the review pass.
---
Originally published on DevPik.
@claudeai What Claude skills do you recommend for logo design? 🎨
I tried kaankiziltug/logo-design-skill: solid start, but we're still far from what a real designer delivers.
Which skills, prompts or workflows actually work for you?
1 like · 49 views
@gastonfonceadev ni idea pero el otro dia me guarde esta skill (no la probe) quizas te sirve
kaankiziltug/logo-design-skill
3 likes · 79 views
came across this logo-design skill for Claude Code tonight. it renders its own draft SVGs and tests them (16px legibility, one-color, squint test, shelf-test) against a 1400+ logo library, then stops so I can redirect before the full kit. @kaankiziltug kaankiziltug/logo-design-skill t.co
2 likes · 149 views
10 Claude Code Skills I Actually Use Through SkillGild
By Niloy Nath, sharing my experience as a SkillGild consumer.
I use Claude Code skills through SkillGild for frontend work, code review, and getting finished work out into the world. Paying for the skills I keep returning to has been one of my best decisions for this workflow. Vernier is the clearest example.
I'm writing this as a SkillGild consumer. This is my personal Claude skills shortlist, based on the work I want my agent to do. My list includes two paid skills and eight free ones; I checked the current catalog on October 9, 2026.
My work covers backend systems and AI infrastructure, so I care about the implementation and the checks around it. I want a skill to leave me with something I can inspect and use in a project.
If you only want the short answer: I pay for the parts that solve a recurring problem, then add free skills around them. A paid skill earns its place when I can explain what I use it for without reciting its feature list.
The Claude Code skills I use, at a glance
| Skill | What I use it for | Current access |
| --- | --- | --- |
| Vernier | Interactive illustrations for product interfaces | SkillGild Pro |
| Pro Preview | Checking color contrast before shipping | SkillGild Pro |
| Taste Skill | Frontend layout and visual direction | Free hosted skill |
| Logo Design | SVG marks and brand concepts | Free hosted skill |
| Brag | Turning project work into a launch video | Free hosted skill |
| HyperFrames | Controlling the video composition and timing | Free hosted skill |
| OpenSpec Propose | Defining a feature before implementation | Free hosted skill |
| Code Review | Reviewing a diff for concrete problems | Free community plugin |
| Webapp Testing | Checking an app in a real browser | Free hosted skill |
| Academic Plotting | Research figures and readable chart colors | Free hosted skill |
The order follows my workflow and preferences. It isn't a benchmark ranking. The original creators are credited below; getting a skill through SkillGild doesn't make it a SkillGild invention.
What are Claude Code skills?
Claude Code skills are folders containing a SKILL.md guide and, when needed, scripts or reference files. Claude loads relevant instructions to help with a task. A skill can describe a local workflow or teach your agent how to use a hosted service such as SkillGild.
1. Vernier: the paid Claude Code skill I value most
!Illustrated concept of one normalized reading controlled by pointer, touch, or keyboard input
AI-generated editorial concept illustrating the interaction model; see the linked skill examples for actual Vernier output.
Vernier is my first pick when I want an interface illustration that responds to the person using it.
The useful part is the interaction model. Vernier makes isometric line illustrations that can respond to a pointer, touch, keyboard input, or a live signal. The deliverables include a React component, a web component, and a preview page. That fits the kind of product interfaces I work with much better than treating every visual as a static image.
For example, I'd give the agent this brief:
> Use Vernier to design an isometric illustration for a developer tool. Show one reading from 0 to 1. Give it pointer, touch, and keyboard controls, and keep the highlight consistent with the interface accent.
That is a specific job with an output I can inspect. It's why paying for Vernier feels worthwhile to me: I want a reusable way to build this kind of interaction, rather than spending every session explaining the same behavior again.
I also respect its limits. Vernier isn't the choice for a photograph, a logo, or a chart with several data series and axes. It shows one reading at a time. If the requirement is a line chart comparing experiments, I move to Academic Plotting.
My recommendation: if interactive product graphics are part of your regular work, look at Vernier's examples and requirements, then compare the current Pro plans. This is where I'd start with a paid skill.
2. Pro Preview: a paid check I can use before shipping
I use Pro Preview for a quieter problem: colors that look acceptable in a screenshot but don't have enough contrast in the interface.
It checks a palette against WCAG contrast ratios and suggests alternatives that pass the requested checks. That gives me something concrete to review when an agent changes the colors in a dashboard, slide, or chart.
The distinction matters with charts. A color can be readable as a thick line and still fail when used for a small text label. WCAG's minimum contrast guidance explains the text requirements; I don't want to decide that by eye.
My prompt is usually closer to this than to “make the colors accessible”:
> Check these foreground and background pairs. Separate small text from larger graphical elements, explain which checks fail, and propose replacements that preserve the meaning of the palette.
A contrast check covers contrast. I still need to inspect keyboard navigation, labels, focus states, and the rest of the interface. Pro Preview earns its place by giving me a bounded check I can repeat.
At publication, Vernier and Pro Preview are the two premium skills listed in SkillGild Pro, each with 25 sessions per calendar month. Prices and the payment method depend on billing country. I use the pricing page for the current terms rather than copying a price that may change.
3. Taste Skill: frontend direction before more components
Taste Skill, credited to Leonxlnx, is one of the free Claude Code skills I keep around for frontend work.
I use it when a page technically works but still feels like the agent assembled whatever layout it reached for first. Giving the agent a brief and a visual direction is more useful than asking for another round of decorative changes.
My brief names the audience, the main action, the content that must remain, and the existing design system. For an established page, I want an audit before a redesign. The skill helps establish that sequence.
I don't apply it indiscriminately to every component. If the task is to fix an indexing directive, the best result may be a two-line change. A design pass should serve the page, not turn a small repair into a new website.
SkillGild's Taste Skill walkthrough is a useful way to see the kind of brief and output involved before installing it.
4. Logo Design: give the mark constraints
I use Logo Design, by kaankiziltug, when I need a mark I can use in an actual interface.
The output being an SVG matters. I want to inspect the geometry, try it at a small size, and see what happens in one color. A polished concept board alone doesn't answer those questions.
The brief needs to name the product, the intended audience, and where the mark will appear. I also specify restrictions early: whether text belongs in the mark, how it should read at 16 pixels, and which visual ideas to avoid.
This is a good companion to Taste Skill. One helps establish the page's visual direction; the other focuses on the mark. I keep those tasks separate so the agent doesn't redesign everything while solving a logo problem.
5. Brag: turn finished project work into something shareable
Brag, by Shunit Haviv Hakimi, is the skill I reach for when the project exists and I want to show it to someone.
Its starting point is the code. The agent reads the project and builds a launch-video workflow around what is there, which is useful before I have a polished live demo ready.
One of my launch-video projects needed a 90-second film with separate desktop, mobile, and social cuts. That made the brief important: the audience, the story, and what the product could actually do had to be explicit. A skill gives the agent a method; I still have to give it the right project facts.
I use Brag for the launch-film task, and check the resulting scenes against the product. Screens that imply features the app doesn't have would make the video worse, however good the animation looked.
You can watch a creator-provided Brag example before deciding whether it fits your project.
6. HyperFrames: when I need control over the video
HyperFrames, by HeyGen, is where I go deeper into the composition.
The workflow uses HTML with timed clips and animation, then renders to video through the HyperFrames CLI. It suits me because I can work with the composition as code: change a scene, review a frame, and adjust the timing.
The practical lesson from the launch-video work is to treat the mobile version as its own composition. A desktop frame cropped into a vertical rectangle can lose the words or UI that made the shot useful.
I use Brag when I want the project-to-launch-film workflow. I use HyperFrames when I need to work on the underlying composition and render. They cover different stages of the same job.
This is still a local rendering workflow. Check the renderer requirements and installation steps on the skill page before assuming the skill alone can produce an MP4.
7. OpenSpec Propose: write down the change before writing code
I use OpenSpec Propose, by Fission AI, when a feature has enough moving parts that a casual prompt leaves room for several different implementations.
The skill produces a proposal, specification changes, a design, and implementation tasks grounded in the project's existing specs. I want those artifacts to state what will change and what a working result looks like.
A useful prompt includes the trigger and the expected behavior. “Improve billing” is too broad. “After a successful payment, attach the purchase to the account using the checkout email, and make repeated callbacks safe” gives the proposal something to resolve.
I skip the ceremony for small repairs. For changes that cross a frontend, an API, and stored state, writing the agreement first is worth the effort.
The OpenSpec guide covers the workflow in more detail.
8. Code Review: ask for findings I can verify
Code Review is Anthropic's official plugin, listed as a free community skill through SkillGild. Its upstream source remains the place to inspect the plugin itself.
I use it after a meaningful change, with a narrow request: review the diff for correctness, project conventions, and the behavior the task required. I want a location and a reason for each finding.
An agent saying “the code looks good” doesn't give me much to work with. A finding that identifies an incorrect condition and explains the case it mishandles is something I can check.
I still verify the findings. A review can miss a bug or report a false positive. The value is another structured pass over the change before I call it finished.
9. Webapp Testing: the browser gets a vote
I use Webapp Testing, from Anthropic's skills repository, to check the interface in a real browser.
This matters because a build can pass while a link is covered by another element, an image fails to load, or a mobile layout overflows. Those are observable failures, and I want the agent to bring back the browser evidence.
For video watch pages, the check needs to include playback and the links that take someone to the page. For a form, it needs the submit path and the states a person can actually reach. I name the flow instead of asking the agent to “test everything.”
I usually include desktop and mobile viewport sizes in the brief. A screenshot helps, but clicking the control and checking its result is the part I care about most.
10. Academic Plotting: figures that survive being read
Academic Plotting is credited to Orchestra Research. I use it when the output is a chart for a technical explanation, paper, or research result.
The task starts with the data and the comparison I want a reader to understand. Then I can ask for the chart type, plotting code, and the checks needed for the intended output size.
SkillGild's recorded plotting walkthrough gives a concrete example: the original colors passed the graphics contrast check but failed the small-label check. The revised colors returned ratios of 5.14:1 and 5.60:1 against white. The run uses a synthetic dataset and was performed with Codex; it isn't a claim about a Claude Code experiment.
That example captures why I keep a plotting skill around. A chart can look fine at full screen and become unreadable in a document. I want the agent to consider the final figure size while it writes the code.
How I install these Claude Code skills through SkillGild
Once the SkillGild CLI is installed and connected, the command format is:
skillgild install vernier --agent claude-code
skillgild install pro-preview --agent claude-code
skillgild install design-taste-frontend --agent claude-code
Replace the slug with the skill you want. The Claude Code installation guide covers setup; the individual listing tells you whether the skill is hosted or installed from an upstream repository.
For hosted skills, installation puts the guide into the agent's workflow; an account and the required entitlement are still needed to start a session. Installing a wrapper doesn't unlock a paid skill. Your coding agent also keeps using its own model and subscription.
Anthropic's skill documentation explains Claude Code's personal and project skill locations. I use project scope when a workflow belongs to a repository, and personal scope when I want it across projects.
Are Claude Code skills free?
Some are free; some require a paid service or plan. On SkillGild, the current listings distinguish free hosted skills, free community skills, and Pro skills. Hosted session allowances and local execution are different things, so I check the listing rather than treating every installation as a paid run.
The eight free skills above don't require a Pro purchase just because Vernier and Pro Preview do. Any costs for your agent's model, renderer, or other services are separate.
Is it worth paying for Claude Code skills?
For me, yes, when the paid skill matches work I return to. Paying for Vernier has been one of my best decisions for this part of my workflow. I know the kind of visual interaction I want it to help build, and I can inspect what it produces.
I wouldn't buy a plan just to have a bigger skills list. If you mainly need code review and browser checks, start with the free skills. If you repeatedly need interactive product illustrations or the premium contrast-checking tools, compare SkillGild Pro.
Which Claude Code skills would I start with?
My starting pair would be Vernier for the interactive visuals I care about, and Webapp Testing to check the interface I ship. If the immediate task is a landing page, I'd add Taste Skill. If it's a launch video, I'd add Brag.
Pick the job first. Then open the relevant SkillGild listing, check what the skill needs, and give it a real brief. That is the part of using skills that has been most helpful to me.
Originally published on my portfolio.
Logo Design Skill Packages SVG Checks for AI Agents
The public, MIT-licensed logo-design-skill repository packages a staged logo-design workflow for Claude Code, Gemini CLI, Codex CLI and other agents that support skills. Developers can install its instructions, reference material and Python tools to move from a brief to tested SVG concepts and, after approval, a broader identity kit.
Three concepts, then a hard stop
The prescribed process begins with a brief and category research. It then calls for eight to 12 one-line concepts, of which three are built in SVG and tested before presentation. At the checkpoint, the agent shows the directions in one overview image, recommends one and waits for the user to choose or request changes, according to the repository’s workflow.
That stop is mandatory in the documented process. The agent does not produce the colour system, lockups, presentation board, icons or guidelines until the user approves a direction and requests the kit. The project says this avoids completing the most substantial part of the work for an unapproved idea (GitHub).
SVG tests and delivery tools
The repository includes dependency-free Python utilities for auditing SVGs, rendering PNGs, assembling concept sheets and creating presentation boards. Its test sheets cover 16-pixel rendering, one-colour and reversed variants, squint and mirror checks, contextual mockups and a competitor shelf test. It can also export favicon, app-icon and web-manifest assets (GitHub).
A separate reference library contains more than 1,400 real-world SVG logos classified by attributes including mark type, technique, geometry, subject, typography, mood and industry. The collection is searchable from the command line and browsable through a local gallery. The project frames it as material for studying construction, identifying category conventions and avoiding look-alikes—not for copying existing marks (GitHub).
Portability depends on the host agent
The skill follows the Agent Skills structure: a folder containing SKILL.md, with instructions in Markdown and tools in Python. The installation guide supplies personal and project-level paths for Gemini CLI and Codex CLI, while directing users of other compatible agents to their respective skills directories. The README says an image-capable model works best because the workflow renders drafts to PNG and inspects them before presentation (GitHub).
Analysis: reviewability comes at the cost of autonomy
Analysis: The approval checkpoint is the project’s most consequential constraint. By refusing to create the full kit before a direction is selected, the workflow prioritizes reviewable intermediate work over unattended completion. That can limit effort spent finishing a rejected concept, but it also means teams seeking batch or hands-off generation will encounter a deliberate interruption (GitHub).
The evidence for output quality remains internal. The repository presents 28 fictional briefs run through the process across multiple sectors, with some examples showing a selected concept that differs from the skill’s recommendation. Those examples document how the workflow behaves, but they should not be read as independent validation of originality or professional design quality (GitHub).
1 comment
Годный скилл для создания качественных логотипов — logo-design-skill
подключает ИИ-агентам полный процесс разработки лого, включая дизайн, типографику и верстку. → Он покрывает всё: от создания брифа и концептов до выбора цветовой палитры и...
kaankiziltug/logo-design-skill
Mentions
Yapay zekayla logo yapıyorum ama şöyle slop oluyor, böyle kötü oluyor diyorsan gel... Bu aracın içinde 1400'den fazla görsel referans var. Bu sayede birbirine benzemeyen tertemiz logolar çıkartıyorsun :D Aha da repo'nun linki: kaankiziltug/logo-design-skill t.co
7 GitHub repos for the ULTIMATE Design AI Seven open source repos that between them cover most of what a design department does, from reading a competitor's site to shipping the prototype. Every one is free and runs on your own machine, and together they carry over 436,000 GitHub stars. KyoubeAI: KyoubeAI/KyoubeAI CHAPTERS 0:00 Intro 0:12 The lineup 0:38 1. designlang 1:12 2. logo-design-skill 1:50 3. awesome-design-md 2:28 4. Hallmark 3:11 5. Impeccable 3:52 6. diagram-design 4:26 7. OpenDesign 5:03 Who it's for 5:29 All linked THE SEVEN REPOS 1. designlang (4,412 stars, MIT) Manavarya09/design-extract Reads any website's design system off the live page. 2. logo-design-skill (5,154 stars, MIT) kaankiziltug/logo-design-skill Takes a logo from the brief to production-ready SVG. 3. awesome-design-md (124,388 stars, MIT) VoltAgent/awesome-design-md Ready-made DESIGN.md files your agent builds from. 4. Hallmark (41,429 stars, MIT) Nutlope/hallmark Builds new pages that don't look AI-generated. 5. Impeccable (94,097 stars, Apache-2.0) pbakaus/impeccable Design words, a reviewer and a slop detector for your agent. 6. diagram-design (62,675 stars, MIT) cathrynlavery/diagram-design On-brand diagrams as one HTML file. 7. OpenDesign (104,778 stars, Apache-2.0) nexu-io/open-design A local-first design studio driven by the agent you already use. Made with HyperFrames: heygen-com/hyperframes If this video helped you, do subscribe. #AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign [de-DE] 7 GitHub-Repos für die ULTIMATIVE Design-KI Sieben Open-Source-Repositories decken zusammen fast alle Aufgaben einer Designabteilung ab – von der Analyse der Konkurrenz bis zum Prototypenversand. Alle sind kostenlos und laufen auf Ihrem eigenen Rechner. Zusammen verzeichnen sie über 436.000 GitHub-Sterne. KyoubeAI: KyoubeAI/KyoubeAI KAPITEL 0:00 Einleitung 0:12 Die Liste 0:38 1. designlang 1:12 2. logo-design-skill 1:50 3. awesome-design-md 2:28 4. Hallmark 3:11 5. Impeccable 3:52 6. diagram-design 4:26 7. OpenDesign 5:03 Für wen ist es gedacht? 5:29 Alle verlinkten Repositories DIE SIEBEN REPOS 1. designlang (4.412 Sterne, MIT-Lizenz) Manavarya09/design-extract Liest das Designsystem jeder Website von der Live-Seite aus. 2. logo-design-skill (5.154 Sterne, MIT) kaankiziltug/logo-design-skill Erstellt aus einem Briefing ein produktionsfertiges SVG-Logo. 3. awesome-design-md (124.388 Sterne, MIT) VoltAgent/awesome-design-md Vorgefertigte DESIGN.md-Dateien für Ihren Agenten. 4. Hallmark (41.429 Sterne, MIT) Nutlope/hallmark Erstellt neue Seiten, die nicht KI-generiert aussehen. 5. Impeccable (94.097 Sterne, Apache-2.0) pbakaus/impeccable Entwurfstexte, ein Korrekturleser und ein Fehlerdetektor für Ihren Agenten. 6. diagram-design (62.675 Sterne, MIT-Lizenz) cathrynlavery/diagram-design Markenkonforme Diagramme in einer einzigen HTML-Datei. 7. OpenDesign (104.778 Sterne, Apache-2.0) nexu-io/open-design Ein lokales Designstudio, das mit Ihrem gewohnten Agenten arbeitet. Erstellt mit HyperFrames: heygen-com/hyperframes Hat Ihnen dieses Video geholfen? Dann abonnieren Sie unseren Kanal! #KIdesign #OpenSource #GitHub #KIagenten #ClaudeCode #Selbstgehostet #UIDesign [es-US] 7 repos de GitHub para la IA de diseño DEFINITIVA Siete repositorios de código abierto que, en conjunto, abarcan la mayor parte del trabajo de un departamento de diseño, desde analizar el sitio web de la competencia hasta lanzar el prototipo. Todos son gratuitos y se ejecutan en tu propio ordenador, y en conjunto suman más de 436.000 estrellas en GitHub. KyoubeAI: KyoubeAI/KyoubeAI CAPÍTULOS 0:00 Introducción 0:12 Lista de herramientas 0:38 1. designlang 1:12 2. logo-design-skill 1:50 3. awesome-design-md 2:28 4. Hallmark 3:11 5. Impeccable 3:52 6. diagram-design 4:26 7. OpenDesign 5:03 Para quién es 5:29 Enlaces LOS SIETE REPOSITORIOS 1. designlang (4412 estrellas, MIT) Manavarya09/design-extract Lee el sistema de diseño de cualquier sitio web directamente desde la página. 2. logo-design-skill (5154 estrellas, MIT) kaankiziltug/logo-design-skill Transforma un logotipo, desde el briefing hasta un archivo SVG listo para producción. 3. awesome-design-md (124 388 estrellas, MIT) VoltAgent/awesome-design-md Archivos DESIGN.md predefinidos que tu agente puede usar para crear sus páginas. 4. Hallmark (41 429 estrellas, MIT) Nutlope/hallmark Crea páginas nuevas con un aspecto natural, sin parecer generadas por IA. 5. Impeccable (94 097 estrellas, Apache-2.0) pbakaus/impeccable Diseña textos, un revisor y un detector de errores para tu agente. 6. diagram-design (62.675 estrellas, MIT) cathrynlavery/diagram-design Diagramas personalizados en un solo archivo HTML. 7. OpenDesign (104.778 estrellas, Apache-2.0) nexu-io/open-design Un estudio de diseño local impulsado por el agente que ya utilizas. Creado con HyperFrames: heygen-com/hyperframes Si este video te fue útil, suscríbete. #DiseñoIA #códigoabierto #github #AgentesIA #ClaudeCode #autoalojado #diseñoUI [fr-FR] 7 dépôts GitHub pour l'IA de design ULTIME Sept dépôts open source qui, ensemble, couvrent la plupart des tâches d'un bureau d'études, de l'analyse du site concurrent à la livraison du prototype. Chacun est gratuit et s'exécute sur votre machine. Ils cumulent plus de 436 000 étoiles sur GitHub. KyoubeAI : KyoubeAI/KyoubeAI CHAPITRES 0:00 Introduction 0:12 Présentation des outils 0:38 1. designlang 1:12 2. logo-design-skill 1:50 3. awesome-design-md 2:28 4. Hallmark 3:11 5. Impeccable 3:52 6. diagram-design 4:26 7. OpenDesign 5:03 À qui s'adresse cet outil ? 5:29 Tous les liens sont disponibles LES SEPT DÉPÔTS 1. designlang (4 412 étoiles, MIT) Manavarya09/design-extract Extrait le système de conception de n'importe quel site web directement depuis la page. 2. logo-design-skill (5 154 étoiles, licence MIT) kaankiziltug/logo-design-skill Transforme un logo, du brief au fichier SVG prêt pour la production. 3. awesome-design-md (124 388 étoiles, licence MIT) VoltAgent/awesome-design-md Fichiers DESIGN.md prêts à l'emploi pour votre agent. 4. Hallmark (41 429 étoiles, licence MIT) Nutlope/hallmark Crée des pages web au design naturel, sans effet artificiel. 5. Impeccable (94 097 étoiles, licence Apache-2.0) pbakaus/impeccable Outils de conception, de relecture et de détection d'erreurs pour votre agent. 6. diagram-design (62 675 étoiles, MIT) cathrynlavery/diagram-design Des diagrammes conformes à votre charte graphique, regroupés dans un seul fichier HTML. 7. OpenDesign (104 778 étoiles, Apache-2.0) nexu-io/open-design Un studio de design optimisé pour une utilisation locale, piloté par l'agent que vous utilisez déjà. Développé avec HyperFrames : heygen-com/hyperframes Si cette vidéo vous a été utile, abonnez-vous ! #AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign [hi] अल्टीमेट डिज़ाइन AI के लिए 7 GitHub रिपोज़ ये सात ओपन सोर्स रिपॉजिटरी डिज़ाइन विभाग के लगभग सभी कार्यों को कवर करती हैं, जिनमें प्रतिस्पर्धी वेबसाइट का अध्ययन करने से लेकर प्रोटोटाइप तैयार करने तक शामिल है। ये सभी निःशुल्क हैं और आपके कंप्यूटर पर चलती हैं, और इन सभी को मिलाकर GitHub पर 436,000 से अधिक स्टार मिले हैं। KyoubeAI: KyoubeAI/KyoubeAI अध्याय 0:00 परिचय 0:12 मुख्य भाग 0:38 1. डिज़ाइनलैंग 1:12 2. लोगो-डिज़ाइन-कौशल 1:50 3. ऑसम-डिज़ाइन-एमडी 2:28 4. हॉलमार्क 3:11 5. इम्पेकेबल 3:52 6. डायग्राम-डिज़ाइन 4:26 7. ओपनडिज़ाइन 5:03 किसके लिए 5:29 सभी लिंक सात रिपॉज़िटरी 1. डिज़ाइनलैंग (4,412 स्टार, MIT) Manavarya09/design-extract लाइव पेज से किसी भी वेबसाइट के डिज़ाइन सिस्टम को पढ़ता है। 2. लोगो-डिज़ाइन-स्किल (5,154 स्टार, MIT) kaankiziltug/logo-design-skill यह लोगो को ब्रीफ से प्रोडक्शन-रेडी SVG में बदलता है। 3. ऑसम-डिज़ाइन-एमडी (124,388 स्टार, MIT) VoltAgent/awesome-design-md तैयार DESIGN.md फ़ाइलें जिनसे आपका एजेंट बिल्ड करता है। 4. हॉलमार्क (41,429 स्टार, MIT) Nutlope/hallmark ऐसे नए पेज बनाता है जो AI जनरेटेड नहीं लगते। 5. इम्पेकेबल (94,097 स्टार, Apache-2.0) pbakaus/impeccable आपके एजेंट के लिए डिज़ाइन शब्द, एक समीक्षक और एक स्लोप डिटेक्टर। 6. डायग्राम-डिज़ाइन (62,675 स्टार, MIT) cathrynlavery/diagram-design ब्रांड के अनुरूप डायग्राम एक HTML फ़ाइल में। 7. ओपनडिज़ाइन (104,778 स्टार, Apache-2.0) nexu-io/open-design एक स्थानीय-केंद्रित डिज़ाइन स्टूडियो, जो आपके पहले से उपयोग किए जा रहे एजेंट द्वारा संचालित है। हाइपरफ्रेम्स के साथ बनाया गया: heygen-com/hyperframes अगर इस वीडियो से आपको मदद मिली, तो सब्सक्राइब करें। #AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign [id] 7 Repo GitHub untuk AI Desain TERBAIK Tujuh repositori sumber terbuka yang mencakup sebagian besar pekerjaan departemen desain, mulai dari membaca situs pesaing hingga mengirimkan prototipe. Semuanya gratis dan dapat dijalankan di mesin Anda sendiri, dan secara keseluruhan memiliki lebih dari 436.000 bintang GitHub. KyoubeAI: KyoubeAI/KyoubeAI BAB 0:00 Pendahuluan 0:12 Daftar pustaka 0:38 1. designlang 1:12 2. logo-design-skill 1:50 3. awesome-design-md 2:28 4. Hallmark 3:11 5. Impeccable 3:52 6. diagram-design 4:26 7. OpenDesign 5:03 Untuk siapa pustaka ini 5:29 Semua pustaka terhubung TUJUH REPOSITORI 1. designlang (4.412 bintang, MIT) Manavarya09/design-extract Membaca sistem desain situs web apa pun dari halaman langsung. 2. logo-design-skill (5.154 bintang, MIT) kaankiziltug/logo-design-skill Mengubah logo dari brief menjadi SVG siap produksi. 3. awesome-design-md (124.388 bintang, MIT) VoltAgent/awesome-design-md File DESIGN.md siap pakai yang dapat digunakan agen Anda untuk membangun halaman. 4. Hallmark (41.429 bintang, MIT) Nutlope/hallmark Membangun halaman baru yang tidak terlihat seperti hasil buatan AI. 5. Impeccable (94.097 bintang, Apache-2.0) pbakaus/impeccable Mendesain kata-kata, peninjau, dan pendeteksi kesalahan untuk agen Anda. 6. diagram-design (62.675 bintang, MIT) cathrynlavery/diagram-design Diagram yang sesuai dengan merek sebagai satu file HTML. 7. OpenDesign (104.778 bintang, Apache-2.0) nexu-io/open-design Studio desain yang mengutamakan lokal dan digerakkan oleh agen yang sudah Anda gunakan. Dibuat dengan HyperFrames: heygen-com/hyperframes Jika video ini membantu Anda, silakan berlangganan. #AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign [it] 7 repository GitHub per l'AI di design DEFINITIVA Sette repository open source che, nel loro insieme, coprono la maggior parte delle attività di un reparto di design, dalla lettura del sito di un concorrente alla realizzazione del prototipo. Ognuno di essi è gratuito e funziona sul proprio computer, e insieme vantano oltre 436.000 stelle su GitHub. KyoubeAI: KyoubeAI/KyoubeAI CAPITOLI 0:00 Introduzione 0:12 La lista 0:38 1. designlang 1:12 2. logo-design-skill 1:50 3. awesome-design-md 2:28 4. Hallmark 3:11 5. Impeccable 3:52 6. diagram-design 4:26 7. OpenDesign 5:03 A chi è rivolto 5:29 Tutti i link I SETTE REPOSITORY 1. designlang (4.412 stelle, MIT) Manavarya09/design-extract Legge il design system di qualsiasi sito web direttamente dalla pagina. 2. logo-design-skill (5.154 stelle, MIT) kaankiziltug/logo-design-skill Trasforma un logo, a partire dal brief, in un file SVG pronto per la produzione. 3. awesome-design-md (124.388 stelle, MIT) VoltAgent/awesome-design-md File DESIGN.md predefiniti che il tuo agente può utilizzare per creare le tue pagine. 4. Hallmark (41.429 stelle, MIT) Nutlope/hallmark Crea nuove pagine che non sembrano generate dall'IA. 5. Impeccable (94.097 stelle, Apache-2.0) pbakaus/impeccable Testo di progettazione, strumento di revisione e rilevatore di errori per il tuo agente. 6. diagram-design (62.675 stelle, MIT) cathrynlavery/diagram-design Diagrammi in linea con il brand in un unico file HTML. 7. OpenDesign (104.778 stelle, Apache-2.0) nexu-io/open-design Uno studio di design incentrato sull'ambiente locale, basato sull'agente che già utilizzi. Realizzato con HyperFrames: heygen-com/hyperframes Se questo video ti è stato utile, iscriviti al canale. #AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign [pt-BR] 7 repositórios do GitHub para a IA de Design DEFINITIVA Sete repositórios de código aberto que, juntos, abrangem a maior parte das atividades de um departamento de design, desde a análise do site de um concorrente até o envio do protótipo. Todos são gratuitos e funcionam em sua própria máquina, e juntos somam mais de 436.000 estrelas no GitHub. KyoubeAI: KyoubeAI/KyoubeAI CAPÍTULOS 0:00 Introdução 0:12 A lista de projetos 0:38 1. designlang 1:12 2. logo-design-skill 1:50 3. awesome-design-md 2:28 4. Hallmark 3:11 5. Impeccable 3:52 6. diagram-design 4:26 7. OpenDesign 5:03 Para quem é indicado 5:29 Todos os projetos estão linkados OS SETE REPOSITÓRIOS 1. designlang (4.412 estrelas, MIT) Manavarya09/design-extract Lê o sistema de design de qualquer site diretamente da página. 2. logo-design-skill (5.154 estrelas, MIT) kaankiziltug/logo-design-skill Transforma um briefing em um logotipo pronto para produção em SVG. 3. awesome-design-md (124.388 estrelas, MIT) VoltAgent/awesome-design-md Arquivos DESIGN.md prontos para uso que seu agente utiliza. 4. Hallmark (41.429 estrelas, MIT) Nutlope/hallmark Cria novas páginas que não parecem geradas por IA. 5. Impeccable (94.097 estrelas, Apache-2.0) pbakaus/impeccable Textos de design, um revisor e um detector de erros para seu agente. 6. diagram-design (62.675 estrelas, MIT) cathrynlavery/diagram-design Diagramas personalizados em um único arquivo HTML. 7. OpenDesign (104.778 estrelas, Apache-2.0) nexu-io/open-design Um estúdio de design local, baseado no agente que você já usa. Feito com HyperFrames: heygen-com/hyperframes Se este vídeo te ajudou, inscreva-se no canal. #AIdesign #opensource #github #AIagents #ClaudeCode #selfhosted #UIdesign
@lepture 昨天尝试做图标,直接提示效果很差,后来用了 kaankiziltug/logo-design-skill 好不错。
Logo Design Skill: AI Logo Designer for Claude --- title: "Logo Design Skill: AI Logo Designer for Claude" published: true tags: opensource, ai, claudecode, aiagents canonical_url: devpik.com --- Logo Design Skill is a free, MIT-licensed agent skill that turns Claude or any Agent Skills agent into a logo designer: a brief-to-checkpoint workflow, 1,400+ visually classified reference logos, dependency-free Python audit and export tools, and production-ready SVG output. What Logo Design Skill Actually Is Ask an AI agent for a logo and you usually get clip art with your company name under it: a swoosh, a lightbulb, a hexagon that means nothing. Logo Design Skill exists to stop that. It is a free, MIT-licensed skill that turns Claude, or any agent that supports the open Agent Skills format (Gemini CLI, Codex CLI, Cursor, GitHub Copilot and more), into a disciplined identity designer that works from the first brief to production-ready SVG files and brand guidelines. The repository was created on 26 September 2026 and passed 1,400 stars within its first week on GitHub. Nothing here runs as an app. The skill ships as a SKILL.md file, a shelf of reference documents and dependency-free Python tools that your agent loads as standing instructions. A note on the GitHub language label, which says HTML: the substance is markdown and Python, and the HTML label comes from the local gallery page that browses the reference library. Clone this expecting a web project and you will find a design school for your agent instead. The Problem: AI Logos All Look the Same Every category has its clichés, and AI agents reach for them first. Food delivery gets a fork, a chef hat or a scooter. Security gets a padlock or a shield. Health gets a cross or a heartbeat line. The README's briefs read like a banned-symbols list on purpose: Kiln, a specialty coffee roaster, is told "not rustic cliché"; Keyfort, a password manager, gets "no padlocks, shields, keyholes, fingerprints or chain links"; Mediora, a telehealth app, gets "no crosses, stethoscopes, hearts or pulse lines". The skill's first move is research: it searches its 1,400-logo reference library to map what the category already looks like, so the concepts it builds can avoid both the clichés and accidental look-alikes. That step alone separates it from a prompt that says "design a modern logo" and hopes. The second move is craft that most people never see. Logo work lives in details like optical corrections (overshoot, the bone effect, irradiation), geometric construction and snapping diagonals to exact angles. The skill's audit caught a 60.8° diagonal in an early concept and an off-centre symbol before anything was shown to the client. Our Color Converter is the tool you will reach for when the skill hands you a brand palette and you need it in hex, RGB and HSL without thinking. How It Works: From Brief to Checkpoint The skill runs a fixed pipeline, and each stage has a job. - Brief: the agent starts from your stated assumptions or runs a discovery question bank: word mapping, choosing the right mark type (wordmark, letterform, pictorial, abstract, emblem, mascot and the rest), and a decision guide for which fits. - Research: it queries the reference library for the category, studying construction and conventions, and checking that its ideas do not echo an existing mark. - Concepts: 8 to 12 one-line ideas, of which 3 get built in SVG. - Test and refine: every concept goes through svg_audit.py and a test sheet before you ever see it: 96 and 32 px side by side, one-colour and reversed versions, then a size ladder down to 16 px, plus backgrounds, treatments, contexts and a competitor shelf test. The reference documents cover the full discipline on demand: the twelve principles, mark types, visual techniques (geometry, grids, balance, optical corrections, negative space), colour, typography, the design process, SVG construction, a testing checklist, presentation and delivery, identity systems, redesigns and critique. The agent loads what the task needs and nothing else, which keeps the context lean. The Checkpoint Is the Whole Point The skill always stops at the checkpoint. It shows the concepts as one overview image with a recommendation and offers the full kit. Nothing else is produced until you choose a direction, because the kit (colour, lockups, presentation board, icons, guidelines) is most of the work and only makes sense for an approved idea. This is the design decision that makes the whole thing work. An agent left to run end to end will polish the wrong idea beautifully. Forcing a human decision at the concept stage is what keeps the labour pointed at the right target. The 28 example brands prove the checkpoint earns its place. In four of them the client picked a different concept than the one the skill recommended, and the skill refined that choice before colouring it: Tinkertrail's client took the letterform over the recommended snail because it reads at 16 px; Hearsay's client took the pull-up chair over the recommended ear. That is exactly what the checkpoint is for. A recommendation you cannot overrule is not a recommendation. A 1,400-Logo Reference Library, Visually Classified The library is the skill's unfair advantage. More than 1,400 SVG files covering roughly 1,200 brands, each visually classified by mark type, technique, geometry, subject, typography, mood and industry. The breakdown reads like a design textbook's table of contents: abstract 24%, combination 21%, pictorial 20%, letterform 15%, wordmark 10%, emblem 4%, mascot 4%, lettermark 3%. Median 2 colours, three quarters of the library uses 3 or fewer, gradients appear in 19%, and 141 files are flagged as exemplary teaching examples. It is searchable from the command line (python3 scripts/search_library.py --technique negative-space --exemplary, or --industry payments-fintech --summary) and browsable in a local gallery page. The stated purpose is study: learn construction, map category conventions, avoid look-alikes. Never to copy. The library guide says it plainly, and the TRADEMARKS.md file draws the legal line (more on that in the limitations section). For comparison of scale in this ecosystem, Anti-Slop ships a rulebook where this ships a school. Both are agent skills; one filters output, the other teaches craft. The Tools: Audits, Test Sheets, Boards, Icon Export Everything is plain Python with no dependencies beyond the standard library (Python 3.8+), so the tools run anywhere your agent runs. - svg_audit.py turns craft rules into checks: viewBox and aspect, colour count, anchor points against library medians, near-miss angles, tiny details under 1/48 of the canvas, centring. It ends with a production-readiness score out of 100. The README's own example scores a recommended lockup at 99 and a rejected emblem at 76, with the warnings spelled out. - preview_sheet.py builds an HTML test sheet: sizes, backgrounds, treatments, contexts and the competitor shelf test. - concept_sheet.py renders the one-image concept overview the checkpoint shows you. - presentation_board.py builds client presentation boards with six industry-specific mockups per concept. - render_png.py and export_variants.py take the final SVG to transparent PNGs at exact sizes, a favicon.ico, black/white/mono/square variants and the complete favicon, app-icon and web-manifest set. PNG and ICO export uses whatever renderer is available: cairosvg, rsvg-convert, Inkscape, a Chromium-based browser or macOS Quick Look. If you hand-edit the exported SVG afterwards, running it through an HTML minifier keeps the file lean, and embedding it as a data URI is a one-liner with Base64 encode. 28 Example Brands, Run End to End Twenty-eight fictional briefs, from quiet luxury and neon festivals to B2B SaaS, fintech and health, each run end to end with the skill. For every brand you see exactly what the skill shows at the checkpoint (greyscale concepts at true 64, 32 and 16 px sizes plus a recommendation), followed by a colour preview of the chosen direction on mockups picked for that industry. A few of the strongest: Kiln, a specialty coffee roaster, where the recommended mark is a K whose leg is the kiln's arched firing mouth, with the arch returning as the n of the wordmark. Zestly, a food delivery app, where a citrus wedge flips into a cheeky grinning face, and the skill flags its own honest risk: some people read the wedge as watermelon. Maison Orvelle, a luxury fashion atelier, where a Didone M holds an O like a pendant at a V-neckline, and the craft pass killed an M-in-a-circle for sitting too close to a famous transit sign. Keyfort, a password manager, where one unbroken wall winds inward into a Greek key that is also a fortress with only one way in. The later batches deliberately push vivid, saturated palettes while still passing the one-colour and 3:1 contrast checks, which is the hard combination. Colour that only survives at full saturation is decoration; colour that survives one-colour is identity. Getting Started in One Command Claude Code users get the recommended route, a plugin marketplace install: /plugin marketplace add kaankiziltug/logo-design-skill /plugin install logo-design@logo-design-skill Manual install is a copy: git clone https://github.com/kaankiziltug/logo-design-skill.git then cp -r logo-design-skill/skills/logo-design ~/.claude/skills/logo-design for personal use (or .claude/skills/logo-design per project). Claude.ai and Claude Desktop users download logo-design.zip from the Releases page and upload it under Settings, Capabilities, Skills; if the upload has a size limit, logo-design-lite.zip carries everything except the SVG files themselves. Gemini CLI, Codex CLI and other agents use the open Agent Skills format, so it is the same drill: clone once, copy the folder into your agent's skills directory (~/.gemini/skills/logo-design, ~/.codex/skills/logo-design, and so on), start a new session and ask. Then just ask, in plain language: > "Design a logo for Harbor, a savings app for first-time savers. It should feel calm and safe." > "Here's our current logo (logo.svg), critique it and suggest a refresh." > "Give me three wordmark directions for a specialty coffee roaster called Kiln." > "Turn this symbol into favicon, app icon and one-colour versions, plus a one-page usage guide." Two operational notes. The skill works best with a model that can view images, because it renders its own drafts to PNG and checks them before showing you anything. And like all skills, it loads at session start, so open a new session after installing. The Honest Limitation: Trademarks Are Not MIT, and It Needs Eyes Two caveats, both stated in the repository itself. First, the license split. The skill text, scripts, templates and catalog data are MIT. The 1,400 SVG logo files in assets/library/svg/ are trademarks of their respective owners, included for reference and education only, and are not covered by the MIT license. Study them, learn from them, do not ship them. The skill is built to prevent copying, but the legal responsibility for what you publish stays yours. Second, vision matters. The skill renders its own drafts to PNG and checks them before showing you anything, which is how it catches things like a letterform that reads as a different letter at 16 px. That loop only closes with a model that can view images. Run it on a text-only model and you still get the SVGs and the written reasoning, but you lose the self-review pass, and the self-review is where half the craft lives. The broader limitation is the honest one for any design tool: it executes a process with unusual discipline, but the brief is still yours to write well. A vague brief gets you disciplined clichés. Repo Health: 1,400 Stars in a Week The repository was created on 26 September 2026 and passed 1,400 stars with 79 forks in under a week; the latest push landed on 30 September, two days before this page went up. It carries a badge for #14 on The New 100 agent leaderboard, and the test suite runs on every push via GitHub Actions. The growth curve is the usual early hockey stick, which is either a community forming or a trend passing, and a week is too early to say which. The durable signals: the documentation is enormous and specific (the README alone runs close to 500 lines), the tools are dependency-free and tested, the 28 worked examples show the process rather than describing it, and the project is unusually willing to state what it will not do. Good fit if you need a real logo for a side project, startup or open-source tool and want actual craft (geometry, optical corrections, testing at 16 px) instead of clip art with your name under it. Poor fit if what you need is a human designer's taste, negotiation and accountability, or you were hoping to lift marks out of the reference library. It is built to stop exactly that. FAQ Is Logo Design Skill really free? Yes. The skill text, scripts, templates and catalog data are MIT-licensed with no paid tier. The 1,400 reference SVG logo files are trademarks of their respective owners and are included for reference and education only, not covered by the MIT license. Which AI agents does it work with? Any agent that supports the open Agent Skills format: Claude Code (the plugin marketplace route is recommended), Claude.ai and Claude Desktop, Gemini CLI, Codex CLI, Cursor, GitHub Copilot and OpenCode. The instructions are plain Markdown and the tools are plain Python with no dependencies. Do I need design experience to use it? No. The skill runs the full process itself: discovery questions, word mapping, category research, concepting and testing, then stops at a checkpoint with a recommendation. You pick a direction and ask for the kit. A good brief helps, but the skill will interrogate you for one. How do I install it in Claude Code? Run /plugin marketplace add kaankiziltug/logo-design-skill, then /plugin install logo-design@logo-design-skill. Or manually: git clone the repository and copy skills/logo-design into ~/.claude/skills/. Start a new session afterwards, because skills only load at session start. Can it critique my existing logo? Yes. The skill triggers on critique requests, and its svg_audit.py tool scores any SVG against logo principles: anchor-point complexity, colour count, near-miss angles, tiny details and centring, ending with a production-readiness score out of 100. Why does it need a model that can view images? Because it renders its own drafts to PNG and checks them before showing you anything. That self-review loop is how it catches problems like a letterform that reads as a different letter at 16 px. On a text-only model you still get the SVG and the written reasoning, but you lose the review pass. --- Originally published on DevPik.
@claudeai What Claude skills do you recommend for logo design? 🎨 I tried kaankiziltug/logo-design-skill: solid start, but we're still far from what a real designer delivers. Which skills, prompts or workflows actually work for you?
@gastonfonceadev ni idea pero el otro dia me guarde esta skill (no la probe) quizas te sirve kaankiziltug/logo-design-skill
came across this logo-design skill for Claude Code tonight. it renders its own draft SVGs and tests them (16px legibility, one-color, squint test, shelf-test) against a 1400+ logo library, then stops so I can redirect before the full kit. @kaankiziltug kaankiziltug/logo-design-skill t.co
10 Claude Code Skills I Actually Use Through SkillGild By Niloy Nath, sharing my experience as a SkillGild consumer. I use Claude Code skills through SkillGild for frontend work, code review, and getting finished work out into the world. Paying for the skills I keep returning to has been one of my best decisions for this workflow. Vernier is the clearest example. I'm writing this as a SkillGild consumer. This is my personal Claude skills shortlist, based on the work I want my agent to do. My list includes two paid skills and eight free ones; I checked the current catalog on October 9, 2026. My work covers backend systems and AI infrastructure, so I care about the implementation and the checks around it. I want a skill to leave me with something I can inspect and use in a project. If you only want the short answer: I pay for the parts that solve a recurring problem, then add free skills around them. A paid skill earns its place when I can explain what I use it for without reciting its feature list. The Claude Code skills I use, at a glance | Skill | What I use it for | Current access | | --- | --- | --- | | Vernier | Interactive illustrations for product interfaces | SkillGild Pro | | Pro Preview | Checking color contrast before shipping | SkillGild Pro | | Taste Skill | Frontend layout and visual direction | Free hosted skill | | Logo Design | SVG marks and brand concepts | Free hosted skill | | Brag | Turning project work into a launch video | Free hosted skill | | HyperFrames | Controlling the video composition and timing | Free hosted skill | | OpenSpec Propose | Defining a feature before implementation | Free hosted skill | | Code Review | Reviewing a diff for concrete problems | Free community plugin | | Webapp Testing | Checking an app in a real browser | Free hosted skill | | Academic Plotting | Research figures and readable chart colors | Free hosted skill | The order follows my workflow and preferences. It isn't a benchmark ranking. The original creators are credited below; getting a skill through SkillGild doesn't make it a SkillGild invention. What are Claude Code skills? Claude Code skills are folders containing a SKILL.md guide and, when needed, scripts or reference files. Claude loads relevant instructions to help with a task. A skill can describe a local workflow or teach your agent how to use a hosted service such as SkillGild. 1. Vernier: the paid Claude Code skill I value most !Illustrated concept of one normalized reading controlled by pointer, touch, or keyboard input AI-generated editorial concept illustrating the interaction model; see the linked skill examples for actual Vernier output. Vernier is my first pick when I want an interface illustration that responds to the person using it. The useful part is the interaction model. Vernier makes isometric line illustrations that can respond to a pointer, touch, keyboard input, or a live signal. The deliverables include a React component, a web component, and a preview page. That fits the kind of product interfaces I work with much better than treating every visual as a static image. For example, I'd give the agent this brief: > Use Vernier to design an isometric illustration for a developer tool. Show one reading from 0 to 1. Give it pointer, touch, and keyboard controls, and keep the highlight consistent with the interface accent. That is a specific job with an output I can inspect. It's why paying for Vernier feels worthwhile to me: I want a reusable way to build this kind of interaction, rather than spending every session explaining the same behavior again. I also respect its limits. Vernier isn't the choice for a photograph, a logo, or a chart with several data series and axes. It shows one reading at a time. If the requirement is a line chart comparing experiments, I move to Academic Plotting. My recommendation: if interactive product graphics are part of your regular work, look at Vernier's examples and requirements, then compare the current Pro plans. This is where I'd start with a paid skill. 2. Pro Preview: a paid check I can use before shipping I use Pro Preview for a quieter problem: colors that look acceptable in a screenshot but don't have enough contrast in the interface. It checks a palette against WCAG contrast ratios and suggests alternatives that pass the requested checks. That gives me something concrete to review when an agent changes the colors in a dashboard, slide, or chart. The distinction matters with charts. A color can be readable as a thick line and still fail when used for a small text label. WCAG's minimum contrast guidance explains the text requirements; I don't want to decide that by eye. My prompt is usually closer to this than to “make the colors accessible”: > Check these foreground and background pairs. Separate small text from larger graphical elements, explain which checks fail, and propose replacements that preserve the meaning of the palette. A contrast check covers contrast. I still need to inspect keyboard navigation, labels, focus states, and the rest of the interface. Pro Preview earns its place by giving me a bounded check I can repeat. At publication, Vernier and Pro Preview are the two premium skills listed in SkillGild Pro, each with 25 sessions per calendar month. Prices and the payment method depend on billing country. I use the pricing page for the current terms rather than copying a price that may change. 3. Taste Skill: frontend direction before more components Taste Skill, credited to Leonxlnx, is one of the free Claude Code skills I keep around for frontend work. I use it when a page technically works but still feels like the agent assembled whatever layout it reached for first. Giving the agent a brief and a visual direction is more useful than asking for another round of decorative changes. My brief names the audience, the main action, the content that must remain, and the existing design system. For an established page, I want an audit before a redesign. The skill helps establish that sequence. I don't apply it indiscriminately to every component. If the task is to fix an indexing directive, the best result may be a two-line change. A design pass should serve the page, not turn a small repair into a new website. SkillGild's Taste Skill walkthrough is a useful way to see the kind of brief and output involved before installing it. 4. Logo Design: give the mark constraints I use Logo Design, by kaankiziltug, when I need a mark I can use in an actual interface. The output being an SVG matters. I want to inspect the geometry, try it at a small size, and see what happens in one color. A polished concept board alone doesn't answer those questions. The brief needs to name the product, the intended audience, and where the mark will appear. I also specify restrictions early: whether text belongs in the mark, how it should read at 16 pixels, and which visual ideas to avoid. This is a good companion to Taste Skill. One helps establish the page's visual direction; the other focuses on the mark. I keep those tasks separate so the agent doesn't redesign everything while solving a logo problem. 5. Brag: turn finished project work into something shareable Brag, by Shunit Haviv Hakimi, is the skill I reach for when the project exists and I want to show it to someone. Its starting point is the code. The agent reads the project and builds a launch-video workflow around what is there, which is useful before I have a polished live demo ready. One of my launch-video projects needed a 90-second film with separate desktop, mobile, and social cuts. That made the brief important: the audience, the story, and what the product could actually do had to be explicit. A skill gives the agent a method; I still have to give it the right project facts. I use Brag for the launch-film task, and check the resulting scenes against the product. Screens that imply features the app doesn't have would make the video worse, however good the animation looked. You can watch a creator-provided Brag example before deciding whether it fits your project. 6. HyperFrames: when I need control over the video HyperFrames, by HeyGen, is where I go deeper into the composition. The workflow uses HTML with timed clips and animation, then renders to video through the HyperFrames CLI. It suits me because I can work with the composition as code: change a scene, review a frame, and adjust the timing. The practical lesson from the launch-video work is to treat the mobile version as its own composition. A desktop frame cropped into a vertical rectangle can lose the words or UI that made the shot useful. I use Brag when I want the project-to-launch-film workflow. I use HyperFrames when I need to work on the underlying composition and render. They cover different stages of the same job. This is still a local rendering workflow. Check the renderer requirements and installation steps on the skill page before assuming the skill alone can produce an MP4. 7. OpenSpec Propose: write down the change before writing code I use OpenSpec Propose, by Fission AI, when a feature has enough moving parts that a casual prompt leaves room for several different implementations. The skill produces a proposal, specification changes, a design, and implementation tasks grounded in the project's existing specs. I want those artifacts to state what will change and what a working result looks like. A useful prompt includes the trigger and the expected behavior. “Improve billing” is too broad. “After a successful payment, attach the purchase to the account using the checkout email, and make repeated callbacks safe” gives the proposal something to resolve. I skip the ceremony for small repairs. For changes that cross a frontend, an API, and stored state, writing the agreement first is worth the effort. The OpenSpec guide covers the workflow in more detail. 8. Code Review: ask for findings I can verify Code Review is Anthropic's official plugin, listed as a free community skill through SkillGild. Its upstream source remains the place to inspect the plugin itself. I use it after a meaningful change, with a narrow request: review the diff for correctness, project conventions, and the behavior the task required. I want a location and a reason for each finding. An agent saying “the code looks good” doesn't give me much to work with. A finding that identifies an incorrect condition and explains the case it mishandles is something I can check. I still verify the findings. A review can miss a bug or report a false positive. The value is another structured pass over the change before I call it finished. 9. Webapp Testing: the browser gets a vote I use Webapp Testing, from Anthropic's skills repository, to check the interface in a real browser. This matters because a build can pass while a link is covered by another element, an image fails to load, or a mobile layout overflows. Those are observable failures, and I want the agent to bring back the browser evidence. For video watch pages, the check needs to include playback and the links that take someone to the page. For a form, it needs the submit path and the states a person can actually reach. I name the flow instead of asking the agent to “test everything.” I usually include desktop and mobile viewport sizes in the brief. A screenshot helps, but clicking the control and checking its result is the part I care about most. 10. Academic Plotting: figures that survive being read Academic Plotting is credited to Orchestra Research. I use it when the output is a chart for a technical explanation, paper, or research result. The task starts with the data and the comparison I want a reader to understand. Then I can ask for the chart type, plotting code, and the checks needed for the intended output size. SkillGild's recorded plotting walkthrough gives a concrete example: the original colors passed the graphics contrast check but failed the small-label check. The revised colors returned ratios of 5.14:1 and 5.60:1 against white. The run uses a synthetic dataset and was performed with Codex; it isn't a claim about a Claude Code experiment. That example captures why I keep a plotting skill around. A chart can look fine at full screen and become unreadable in a document. I want the agent to consider the final figure size while it writes the code. How I install these Claude Code skills through SkillGild Once the SkillGild CLI is installed and connected, the command format is: skillgild install vernier --agent claude-code skillgild install pro-preview --agent claude-code skillgild install design-taste-frontend --agent claude-code Replace the slug with the skill you want. The Claude Code installation guide covers setup; the individual listing tells you whether the skill is hosted or installed from an upstream repository. For hosted skills, installation puts the guide into the agent's workflow; an account and the required entitlement are still needed to start a session. Installing a wrapper doesn't unlock a paid skill. Your coding agent also keeps using its own model and subscription. Anthropic's skill documentation explains Claude Code's personal and project skill locations. I use project scope when a workflow belongs to a repository, and personal scope when I want it across projects. Are Claude Code skills free? Some are free; some require a paid service or plan. On SkillGild, the current listings distinguish free hosted skills, free community skills, and Pro skills. Hosted session allowances and local execution are different things, so I check the listing rather than treating every installation as a paid run. The eight free skills above don't require a Pro purchase just because Vernier and Pro Preview do. Any costs for your agent's model, renderer, or other services are separate. Is it worth paying for Claude Code skills? For me, yes, when the paid skill matches work I return to. Paying for Vernier has been one of my best decisions for this part of my workflow. I know the kind of visual interaction I want it to help build, and I can inspect what it produces. I wouldn't buy a plan just to have a bigger skills list. If you mainly need code review and browser checks, start with the free skills. If you repeatedly need interactive product illustrations or the premium contrast-checking tools, compare SkillGild Pro. Which Claude Code skills would I start with? My starting pair would be Vernier for the interactive visuals I care about, and Webapp Testing to check the interface I ship. If the immediate task is a landing page, I'd add Taste Skill. If it's a launch video, I'd add Brag. Pick the job first. Then open the relevant SkillGild listing, check what the skill needs, and give it a real brief. That is the part of using skills that has been most helpful to me. Originally published on my portfolio.
Logo Design Skill Packages SVG Checks for AI Agents The public, MIT-licensed logo-design-skill repository packages a staged logo-design workflow for Claude Code, Gemini CLI, Codex CLI and other agents that support skills. Developers can install its instructions, reference material and Python tools to move from a brief to tested SVG concepts and, after approval, a broader identity kit. Three concepts, then a hard stop The prescribed process begins with a brief and category research. It then calls for eight to 12 one-line concepts, of which three are built in SVG and tested before presentation. At the checkpoint, the agent shows the directions in one overview image, recommends one and waits for the user to choose or request changes, according to the repository’s workflow. That stop is mandatory in the documented process. The agent does not produce the colour system, lockups, presentation board, icons or guidelines until the user approves a direction and requests the kit. The project says this avoids completing the most substantial part of the work for an unapproved idea (GitHub). SVG tests and delivery tools The repository includes dependency-free Python utilities for auditing SVGs, rendering PNGs, assembling concept sheets and creating presentation boards. Its test sheets cover 16-pixel rendering, one-colour and reversed variants, squint and mirror checks, contextual mockups and a competitor shelf test. It can also export favicon, app-icon and web-manifest assets (GitHub). A separate reference library contains more than 1,400 real-world SVG logos classified by attributes including mark type, technique, geometry, subject, typography, mood and industry. The collection is searchable from the command line and browsable through a local gallery. The project frames it as material for studying construction, identifying category conventions and avoiding look-alikes—not for copying existing marks (GitHub). Portability depends on the host agent The skill follows the Agent Skills structure: a folder containing SKILL.md, with instructions in Markdown and tools in Python. The installation guide supplies personal and project-level paths for Gemini CLI and Codex CLI, while directing users of other compatible agents to their respective skills directories. The README says an image-capable model works best because the workflow renders drafts to PNG and inspects them before presentation (GitHub). Analysis: reviewability comes at the cost of autonomy Analysis: The approval checkpoint is the project’s most consequential constraint. By refusing to create the full kit before a direction is selected, the workflow prioritizes reviewable intermediate work over unattended completion. That can limit effort spent finishing a rejected concept, but it also means teams seeking batch or hands-off generation will encounter a deliberate interruption (GitHub). The evidence for output quality remains internal. The repository presents 28 fictional briefs run through the process across multiple sectors, with some examples showing a selected concept that differs from the skill’s recommendation. Those examples document how the workflow behaves, but they should not be read as independent validation of originality or professional design quality (GitHub).
Годный скилл для создания качественных логотипов — logo-design-skill подключает ИИ-агентам полный процесс разработки лого, включая дизайн, типографику и верстку. → Он покрывает всё: от создания брифа и концептов до выбора цветовой палитры и... kaankiziltug/logo-design-skill