Seletor de cor online: o guia completo
O seletor de cor Volade é uma ferramenta web tudo-em-um que combina um conta-gotas de ecrã, um editor de cor avançado, um gerador de paletas, um criador de gradientes, um verificador de acessibilidade WCAG, um simulador de daltonismo, um misturador e uma exportação para programadores — tudo numa única interface, 100 % local, sem registo.
Ao contrário dos editores clássicos limitados a HEX/RGB/HSL, o Volade suporta 16 espaços colorimétricos incluindo LAB, LCH, OKLCH, OKLAB, CMYK, Display P3, XYZ e HWB. Cada formato é apresentado em tempo real com um botão de cópia instantânea, tornando-o a ferramenta mais completa para designers, programadores e profissionais de impressão.
O conta-gotas de ecrã: precisão pixel-perfect
O conta-gotas de ecrã utiliza a API EyeDropper dos navegadores modernos para capturar qualquer cor visível no seu ecrã. Clique em qualquer lugar — numa imagem, num site, num documento — e a cor é instantaneamente capturada. A lupa de alta resolução permite-lhe mirar no píxel correto, e a navegação por teclado (setas) oferece precisão absoluta. A amostragem de zona (1×1, 3×3, 5×5, 11×11) suaviza os artefactos de compressão JPEG e obtém a cor média de uma zona.
A cor selecionada aparece no histórico de cores recentes, e a mudança para a cor anterior é instantânea. Para utilizadores avançados, o modo de precisão mostra as coordenadas exatas do píxel e os valores de cada canal em tempo real.
Um editor de cor sem compromissos
O editor apresenta simultaneamente 16 formatos de cor: HEX, HEX8, RGB, RGBA, HSL, HSLA, HSV/HSB, HWB, CMYK, LAB, LCH, OKLAB, OKLCH, Display P3, XYZ e Linear RGB. Cada valor é editável diretamente: altere o HSL e todos os outros formatos são atualizados em tempo real. A roda cromática oferece controlo visual intuitivo, enquanto os sliders numéricos permitem um ajuste preciso.
O alpha/transparência é tratado nativamente: ajuste a opacidade de 0 a 100 % com o slider dedicado, e veja imediatamente o impacto em todos os formatos. O histórico de alterações regista cada mudança, com undo/redo para retroceder a qualquer momento.
Smart Color Intelligence: para além da simples escolha
A partir de uma única cor, a ferramenta gera automaticamente todas as harmonias clássicas: complementar, análogas, triádicas, tetrádicas, complementar dividido e monocromáticas. Mas vai mais longe: as variantes shades (mais escuras), tints (mais claras), tones (dessaturadas), warm (quentes) e cool (frias) são produzidas automaticamente.
O modo Generate Palette transforma qualquer cor num sistema de design completo: primary, secondary, accent, background, surface, text, muted, border, success, warning, error, info — cada um com os seus valores RGB, OKLCH e HEX.
Imagem → Paleta: extrair cores de uma foto
Coloque qualquer imagem (foto, ilustração, captura de ecrã) e a ferramenta analisa os píxeis para extrair a sua paleta. Cinco modos de extração estão disponíveis: Dominant (cores mais frequentes), Vibrant (as mais saturadas), Muted (dessaturadas), Balanced (visualmente harmoniosas) e Brand (cores adequadas a uma identidade visual).
A extração devolve entre 5 e 15 cores, cada uma rotulada com o seu papel potencial (dominante, acento, escura, clara). É um acelerador importante para designers que precisam de extrair um sistema de design de uma foto existente.
Verificação de acessibilidade WCAG
A secção de acessibilidade compara duas cores (primeiro plano vs. fundo) e apresenta a taxa de contraste exata com os emblemas WCAG AA e AAA para texto normal, texto grande e componentes UI. Se a taxa for insuficiente, o botão Auto Fix propõe automaticamente a cor mais próxima que respeita as normas.
É uma ferramenta essencial para programadores que devem cumprir as normas de acessibilidade obrigatórias (RGAA, EN 301 549, ADA, Section 508).
Simulador de daltonismo: conceber para todos
Cerca de 350 milhões de pessoas no mundo são daltónicas. O simulador mostra as suas cores tal como são percebidas pelos oito tipos de daltonismo: protanopia, deuteranopia, tritanopia, acromatopsia e as suas variantes moderadas. É a única forma de verificar se a sua interface é verdadeiramente acessível.
Gerador de gradientes com interpolação avançada
Crie gradientes lineares, radiais e cónicos com até 10 pontos de cor. A interpolação RGB produz gradientes clássicos; HSL oferece transições mais suaves; LAB e OKLCH criam gradientes perceptivamente uniformes sem faixas nem cortes visíveis. O código CSS é gerado automaticamente e copiável com um clique.
Misturador de cores: misturar cores
Misture duas cores com um rácio configurável (de 0/100 a 100/0) em quatro modos: RGB (mistura aditiva), HSL (rotação de matiz), LAB (espace perceptual) e OKLCH (o mais natural). É a ferramenta ideal para criar cores intermédias, sombras e tons personalizados.
ΔE Color Difference: a precisão dos profissionais
Para designers e profissionais de impressão, o cálculo da diferença colorimétrica (Delta E) é essencial. A ferramenta apresenta ΔE76, ΔE94 e ΔE2000 com uma interpretação textual: imperceptível (ΔE < 1), perceptível com esforço (1-2), diferente (2-10), muito diferente (10-50) e contraste elevado (50+).
Color Playground: teste em condições reais
O playground apresenta a sua cor em componentes reais de interface: botões, cartões, badges, inputs, alertas, ligações e texto. Vê imediatamente se a sua cor funciona como cor de fundo, cor de botão ou cor de texto — com as pontuações de acessibilidade em tempo real.
Exportação para programadores: 10 formatos de código
Gere o código na sua linguagem: CSS Variables, SCSS, configuração Tailwind, design tokens JSON, TypeScript, Swift (UIColor), Kotlin (Color), Flutter/Dart, React Native (StyleSheet) e Vue. Cada exportação inclui variantes (50-950) e funções (primary, secondary, accent, etc.).
Quem pode beneficiar?
Designers UI/UX que criam paletas e sistemas de design; programadores front-end que integram cores em CSS, Tailwind ou SCSS; designers gráficos que extraem paletas de fotos; equipas de acessibilidade que verificam o contraste WCAG; profissionais de impressão que calculam as ΔE; e qualquer criador que queira explorar cores de forma profissional.