icon-system

Create an icon system specification covering grid, sizing, naming, categories, and implementation guidance.

Repositório: Infrasity-Labs/dev-gtm-claude-skills
Última atividade na origem: 28 de junho de 2026 às 19:13
Idioma detectado do SKILL.md: inglês
Estrelas: 117
Forks: 10

Opções de instalação

Por padrão, está selecionado o prompt que primeiro revisa a origem. Você pode mudar para um comando direto ou baixar uma cópia local.

Instalar com Codex ou Claude Copie este prompt, cole no Codex, Claude ou outro assistente e deixe que ele revise a página da skill e instale para você.

Um comando direto ignora o prompt de revisão. Verifique a origem antes de executá-lo.

npx skills add https://github.com/Infrasity-Labs/dev-gtm-claude-skills --skill icon-system

O comando permanece em uma só linha. Role horizontalmente para revisá-lo antes de copiar.

Prefere uma cópia local? Baixe os arquivos disponíveis atualmente no SkillsMP.

Revise os arquivos de origem

Leia o SKILL.md e os arquivos complementares exibidos pelo SkillsMP antes de decidir se vai instalar.

SKILL.md

Instruções da origem · Visualização somente leitura

Voltar à pesquisa Voltar à instalação

anydesign

Analyze images, websites, and Figma files to extract their design and generate a `design.md` with token system, component inventory, and reconstruction notes. Use this skill whenever the user wants to understand, document, replicate, or audit the design of something visual: a screenshot, a URL, a Figma link, a Pinterest reference, a mockup, a competitor's site, a component, a dashboard, a landing page. Also when they ask 'extract the design system from X', 'document the style of Y', 'analyze this visually', 'convert this image into tokens', 'help me replicate this design', 'what palette does this site use', 'how is this built'. Also for single elements: 'copy this navbar', 'recreate this illustration', 'give me a prompt to regenerate this graphic' — element mode outputs a focused element.md, with token-grounded image-model prompts when the element is visual art. If the user brings any visual source and wants to understand it at a design level — this skill should activate.

2026-06-28

code-reviewer

Code review automation for TypeScript, JavaScript, Python, Go, Swift, Kotlin, C#, .NET, Java, C, C++, Rust, Ruby, PHP, and Dart/Flutter. Analyzes PRs for complexity and risk, checks code quality for SOLID violations and code smells, generates review reports. Use when reviewing pull requests, analyzing code quality, identifying issues, generating review checklists.

2026-06-28

a-b-test-design

Design rigorous A/B tests with hypotheses, variants, metrics, and sample size calculations.

2026-06-28

Ver todas deste repositório

name	icon-system
description	Create an icon system specification covering grid, sizing, naming, categories, and implementation guidance.

Icon System

You are an expert in designing and maintaining comprehensive icon systems.

What You Do

You create icon system specs ensuring visual consistency and scalable management.

Foundations

Grid: Base size (24x24px), keylines, stroke width, corner radius
Sizes: XS (12-16px), S (20px), M (24px), L (32px), XL (48px+)
Style: Stroke, filled, duotone — when to use each

Naming

icon-[category]-[name]-[variant] Categories: action, navigation, content, communication, social, status, file, device

Delivery

SVG source, sprite sheets, component wrappers, Figma library

Accessibility

Label or aria-hidden for every icon
Pair with text for critical actions
Sufficient contrast
44x44px minimum touch targets

Best Practices

Audit and remove unused icons
Establish contribution workflow
Version alongside design system
Test at every supported size

icon-system

Informações da origem

Opções de instalação

Revise os arquivos de origem

Mais deste repositório

Mais deste repositório

Icon System

What You Do

Foundations

Naming

Delivery

Accessibility

Best Practices

Icon System

What You Do

Foundations

Naming

Delivery

Accessibility

Best Practices