Pular para o conteúdo principal

Gerador de Paleta de Cores

Transforme uma lista de cores hex (opcionalmente nomeadas) em uma única planilha de amostras SVG escalável — uma grade rotulada que você pode copiar ou baixar como um único arquivo. Funciona totalmente no seu navegador.

Entrada

Uma cor por linha: um código hex (#3bf, #3B82F6, ou #3B82F6FF com alfa), opcionalmente precedido por um nome e dois-pontos ("Oceano: #3B82F6"). Linhas em branco são ignoradas.

Layout

Rótulos

Saída

Fonte SVG
 
Paleta de cores

Sua paleta de cores aparecerá aqui.

Cores analisadas
NomeHexRGBCor do texto
No data yet
Isso foi útil?

Mais formas de usar esta ferramenta

API REST

curl -X POST https://api.iotools.cloud/v1/tool/color-swatch-sheet-generator \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "colorList": "Ocean: #3B82F6\n#F97316\nForest: #16A34A",
    "columns": "4",
    "swatchSize": "140",
    "cornerStyle": "rounded",
    "showHex": "true",
    "showRgb": "",
    "showName": "true"
  }'

Troque pela sua própria chave, da sua conta. Os campos da ferramenta viram o corpo da requisição — sem envelope.

Peça a um agente de IA

Use the IOTools `color-swatch-sheet-generator` tool (Color Swatch Sheet Generator) on this input:

YOUR_INPUT_HERE

Cole isto em qualquer agente conectado ao servidor MCP do IOTools e depois adicione sua entrada.

Widget para incorporar

<iframe
  src="https://iotools.cloud/embed/color-swatch-sheet-generator/"
  width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
  title="Gerador de Paleta de Cores — iotools.cloud"
  sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
  allow="clipboard-write"
  style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>

Coloque isso na sua própria página — grátis, sem chave, só um link de volta.

Custo por chamada de API/MCPA partir de 5 créditos
Precisa de mais créditos?Ver preços

Também disponível via

Guias

O que este gerador de paleta de cores faz

Cole uma lista de cores — uma por linha — e ela as organizará em uma única paleta de cores SVG combinada: uma grade de tiles coloridos, cada um rotulado com seu valor hex (e opcionalmente seu nome e valor RGB), pronto para copiar ou baixar como um arquivo. Construído para qualquer coisa apoiada por uma lista de cores simples: uma paleta de marca, um arquivo de token de design, cores personalizadas de configuração Tailwind, ou um moodboard que você está transformando em uma folha de referência. Sem marca d'água, sem conta e sem limite de quantas vezes você pode executá-lo.

Como usar

  1. Cole suas cores na caixa, uma por linha — um código hex (#3B82F6), opcionalmente precedido por um nome e dois-pontos (Oceano: #3B82F6). Linhas em branco são ignoradas, até 100 cores por execução.
  2. Defina quantas amostras por linha, o tamanho de cada amostra e seu estilo de canto (quadrado, arredondado ou pílula).
  3. Alterne quais rótulos mostrar em cada amostra: hex, RGB, e/ou nome (quando um foi fornecido).
  4. Copie a fonte SVG combinada, ou baixe como um arquivo .svg.
  5. A lista de cores analisadas também é mostrada como uma tabela — hex, RGB e a cor de texto preto/branco legível calculada para essa amostra — que você pode copiar ou baixar como CSV.

Quais formatos de cor são aceitos?

Apenas códigos hex, em qualquer um dos três comprimentos padrão: abreviação de 3 dígitos (#3bf), 6 dígitos (#3B82F6), e 8 dígitos com canal alfa (#3B82F680). Prefixe uma linha com um nome e dois-pontos para rotular essa amostra (Oceano: #3B82F6) — o nome é opcional, então um código hex simples em sua própria linha também funciona. rgb(), hsl() e cores nomeadas CSS (tomato, rebeccapurple) não são analisadas; converta para hex primeiro se é isso que você está começando.

Como a cor do rótulo é escolhida?

Automaticamente, por amostra, usando a mesma matemática de luminância relativa que WCAG Contrast Checker: cada amostra recebe texto preto ou branco, o que realmente se lê claramente contra essa cor de preenchimento específica — então uma planilha misturando cores muito claras e muito escuras permanece legível em todo o lugar sem nenhum ajuste manual por amostra.

Existe um limite de quantas cores posso colocar em uma folha?

Sim — 100 cores por execução, portanto o SVG combinado permanece um tamanho gerenciável para visualizar, copiar e baixar. Para uma paleta maior, divida em várias execuções.

Meus dados são privados?

Sim. A paleta é gerada inteiramente no seu navegador — nada que você cole é carregado, registrado ou enviado para lugar algum. Você pode desconectar da internet e esta ferramenta ainda funciona.

Por que SVG em vez de PNG?

Uma paleta de cores SVG é dimensionada sem perda para qualquer tamanho — amplie, imprima em grande formato ou solte diretamente em uma ferramenta de design — sem o desfoque ou reamostragem que uma exportação raster recebe em tamanhos maiores. Cada tile de cor é um elemento <rect> simples e cada rótulo um elemento <text> simples, portanto o arquivo permanece pequeno e fácil de editar manualmente se você precisar ajustá-lo fora desta ferramenta.

colorswatchpalettesvgdesigngenerator

Ama as ferramentas? Livre-se dos anúncios.

Um único pagamento remove todos os anúncios da sua conta, para sempre. Sem assinatura, sem rastreamento.