Ferramentas de Ferramentas de Design
Geradores CSS, ferramentas de cores e criação de SVG
Conversor de Código de Cor
Converta entre códigos de cor HEX, RGB e HSL. Use o seletor de cores e a visualização em tempo real para seleção intuitiva de cores.
Seletor de Cores
Selecione cores intuitivamente usando uma roda de cores e controles deslizantes. Obtenha e copie códigos de cor nos formatos HEX, RGB e HSL.
Extrator de Cores de Imagem
Detecte automaticamente as cores dominantes de uma imagem e gere uma paleta de cores. Você também pode clicar em qualquer lugar da imagem para selecionar cores individuais.
Seletor de Cor Média da Imagem
Calcule a cor média de uma imagem inteira ou de uma área selecionada. Útil para escolher esquemas de cores ou cores de fundo de miniaturas.
Gerador de Gradiente CSS
Crie visualmente gradientes CSS com controles de arraste. Suporta tipos de gradiente linear, radial e cônico com predefinições.
Gerador de CSS Box Shadow
Crie visualmente CSS box-shadow com controles deslizantes. Suporta múltiplas sombras e sombras internas.
Gerador de CSS Border Radius
Gere CSS border-radius com controles individuais de cantos. Inclui opções de raio elíptico e predefinições de formas populares.
Gerador de CSS Text Shadow
Gere CSS text-shadow com visualização ao vivo. Empilhe múltiplas sombras com predefinições de neon, relevo e mais.
Gerador de Triângulo CSS
Gere triângulos CSS usando a propriedade border. Suporta todas as 8 direções com tamanho e cor personalizáveis.
Gerador de CSS Clip Path
Crie visualmente formas CSS clip-path com arrastar e soltar. Inclui polígono, círculo, elipse e predefinições como estrela e coração.
Gerador de CSS Glassmorphism
Crie efeitos de vidro fosco para interfaces com visualização ao vivo e saída CSS. Ajuste transparência, desfoque, borda e configurações de sombra.
Gerador de Loader CSS
Escolha entre múltiplas animações de carregamento CSS e obtenha o código. Personalize cor, tamanho e velocidade para spinners, pontos, barras e mais.
Gerador de CSS Flexbox
Crie layouts Flexbox visualmente e gere código CSS. Ajuste todas as propriedades com uma folha de referência integrada.
Gerador de CSS Cubic Bezier
Crie visualmente curvas de easing para animações CSS. Arraste as alças e visualize animações em tempo real.
Gerador de Tons de Cor
Gere variações de tons claros a escuros de qualquer cor. Ajuste o número de passos e exporte como paleta Tailwind CSS.
Misturador de Cores
Misture duas ou mais cores em proporções específicas para criar novas cores. Compare resultados em diferentes espaços de cor como RGB, HSL e LAB.
Gerador de Paleta de Cores
Gere paletas de cores a partir de uma cor base usando teoria das cores. Inclui esquemas complementar, análogo, triádico e mais.
Pré-visualização de Fontes Web
Pré-visualize fontes web do Google Fonts em tempo real. Compare múltiplas fontes ajustando tamanho e cor.
Referência de Nomes de Cores HTML
Navegue por todas as 148 cores nomeadas HTML/CSS em um só lugar. Pesquise, visualize e copie códigos HEX com facilidade.
Gerador de Padrões de Fundo CSS
Gere padrões de fundo usando CSS puro. Personalize listras, pontos, xadrez e mais com um editor visual.
Gerador de Scrollbar CSS
Personalize o design da barra de rolagem CSS com um editor visual. Ajuste cor, largura, raio da borda e copie o código diretamente.
Gerador de Texto com Gradiente CSS
Gere código CSS para aplicar gradientes ao texto. Pré-visualize cores, direção e ajustes de intervalo em tempo real.
Gerador de Checkbox CSS
Crie checkboxes CSS personalizados com um editor visual. Personalize livremente animações, cores e formas.
Gerador de Toggle Switch CSS
Crie toggle switches CSS personalizados com um editor visual. Ajuste tamanho, cor e animação, depois exporte o código.
Gerador de Blob SVG
Gere automaticamente SVGs com formas orgânicas de blob. Ajuste a aleatoriedade e complexidade para decorações de web design.
Gerador de Padrões SVG
Gere padrões SVG repetíveis em mosaico. Personalize o tipo de padrão, cor e tamanho, depois exporte o código.