Descrição Overview Descripción
A cor em monitores eletrônicos tem uma história que começa com luz, não com tinta. O olho humano percebe cor a partir de três tipos de fotorreceptores sensíveis a comprimentos de onda diferentes — vermelho, verde e azul — e é por isso que o modelo RGB funciona: uma tela emite luz colorida combinando intensidades dessas três componentes. Os primeiros monitores coloridos para PC eram o CGA (Color Graphics Adapter) da IBM, lançado em 1981, com apenas 16 cores. Em 1987 veio o VGA com 256 cores. O marco real foi o modo True Color de 24 bits: 8 bits para vermelho, 8 para verde, 8 para azul, dando 256 × 256 × 256 = 16.777.216 cores possíveis — um número que nossos olhos dificilmente conseguem distinguir completamente. A notação hexadecimal `#RRGGBB` é só uma forma compacta de escrever esses três valores de 0 a 255 em base 16: `#FF0000` é vermelho puro (255 vermelho, 0 verde, 0 azul).
O HTML nasceu sem cor. As primeiras páginas da web, em 1991-1992, eram texto puro. O Mosaic, em 1993, foi o primeiro browser a renderizar imagens inline. O Netscape 1.1, em 1995, introduziu a tag `<body bgcolor>` com cores nomeadas como `red`, `blue` e `green`. O HTML 3.2 de 1997 formalizou 16 nomes de cores, depois expandidos para 140 nomes no CSS2 e mais tarde para os 148 nomes CSS atuais — que incluem pérolas como `rebeccapurple`, adicionado em homenagem a Rebecca Meyer, filha de Eric Meyer, um dos pioneiros do CSS, que morreu de câncer cerebral em 2014 com apenas 6 anos. Além do RGB, o espaço HSL (Hue, Saturation, Lightness) — popularizado no CSS3 — é muito mais intuitivo para ajustes: em RGB, escurecer uma cor envolve reduzir os três valores; em HSL, você só diminui o L.
Gerar cores aleatórias parece trivial mas esconde um problema real: cores verdadeiramente aleatórias em RGB tendem a ser opacas, saturadas e visualmente agressivas — o espaço RGB não é perceptualmente uniforme. Por isso designers frequentemente geram aleatório no espaço HSL com saturação e luminosidade fixas num range agradável, variando só o matiz. O CSS Color Level 4 introduziu o espaço OKLCH, perceptualmente uniforme, onde cores com a mesma luminosidade L parecem igualmente brilhantes para o olho humano — algo que o RGB e mesmo o HSL não garantem. Para mockups rápidos, geração de paletas iniciais, placeholders coloridos em wireframes ou testes de contraste de acessibilidade, ter um gerador de cores aleatórias à mão economiza o tempo que você gastaria abrindo um editor gráfico para pegar um hex qualquer. Esta ferramenta entrega os valores HEX prontos para copiar.
Color on electronic screens has a history that begins with light, not pigment. The human eye perceives color from three types of photoreceptors sensitive to different wavelengths — red, green, and blue — and that is why the RGB model works: a screen emits colored light by combining intensities of those three components. The first color monitors for personal computers were IBM's CGA (Color Graphics Adapter), released in 1981, with just 16 colors. In 1987, VGA brought 256 colors. The real milestone was 24-bit True Color: 8 bits for red, 8 for green, 8 for blue, giving 256 × 256 × 256 = 16,777,216 possible colors — a number our eyes can barely fully distinguish. The hexadecimal notation `#RRGGBB` is simply a compact way to write those three values from 0 to 255 in base 16: `#FF0000` is pure red (255 red, 0 green, 0 blue).
HTML was born without color. The first web pages, in 1991-1992, were plain text. Mosaic, in 1993, was the first browser to render inline images. Netscape 1.1, in 1995, introduced the `<body bgcolor>` tag with named colors like `red`, `blue`, and `green`. HTML 3.2 in 1997 formalized 16 color names, later expanded to 140 in CSS2 and then to the 148 current CSS names — which include gems like `rebeccapurple`, added in honor of Rebecca Meyer, daughter of Eric Meyer, a CSS pioneer, who died of brain cancer in 2014 at the age of six. Beyond RGB, the HSL color space (Hue, Saturation, Lightness) — popularized in CSS3 — is far more intuitive for adjustments: in RGB, darkening a color requires reducing all three values; in HSL, you simply decrease L.
Generating random colors sounds trivial but hides a real problem: truly random colors in RGB tend to be muddy, oversaturated, and visually aggressive — the RGB space is not perceptually uniform. That is why designers often generate random values in HSL space with saturation and lightness locked to a pleasant range, varying only the hue. The CSS Color Level 4 specification introduced the OKLCH space, which is perceptually uniform: colors with the same L lightness value look equally bright to the human eye — something neither RGB nor HSL guarantees. For quick mockups, starter palette generation, colored placeholders in wireframes, or accessibility contrast testing, having a random color generator at hand saves the time you would spend opening a graphics editor just to grab a random hex. This tool delivers the HEX values ready to copy.
El color en las pantallas electrónicas tiene una historia que comienza con la luz, no con la pintura. El ojo humano percibe el color a partir de tres tipos de fotorreceptores sensibles a longitudes de onda diferentes — rojo, verde y azul — y por eso funciona el modelo RGB: una pantalla emite luz de color combinando intensidades de esas tres componentes. Los primeros monitores en color para PC fueron el CGA (Color Graphics Adapter) de IBM, lanzado en 1981, con apenas 16 colores. En 1987 llegó el VGA con 256 colores. El verdadero hito fue el modo True Color de 24 bits: 8 bits para el rojo, 8 para el verde, 8 para el azul, dando 256 × 256 × 256 = 16.777.216 colores posibles — un número que nuestros ojos difícilmente pueden distinguir por completo. La notación hexadecimal `#RRGGBB` es simplemente una forma compacta de escribir esos tres valores de 0 a 255 en base 16: `#FF0000` es rojo puro (255 rojo, 0 verde, 0 azul).
El HTML nació sin color. Las primeras páginas web, en 1991-1992, eran texto puro. Mosaic, en 1993, fue el primer navegador en renderizar imágenes en línea. Netscape 1.1, en 1995, introdujo la etiqueta `<body bgcolor>` con colores nombrados como `red`, `blue` y `green`. El HTML 3.2 de 1997 formalizó 16 nombres de colores, ampliados después a 140 en CSS2 y luego a los 148 nombres CSS actuales — que incluyen joyas como `rebeccapurple`, añadido en honor a Rebecca Meyer, hija de Eric Meyer, uno de los pioneros del CSS, que murió de cáncer cerebral en 2014 a los seis años. Además del RGB, el espacio HSL (Hue, Saturation, Lightness) — popularizado en CSS3 — es mucho más intuitivo para los ajustes: en RGB, oscurecer un color implica reducir los tres valores; en HSL, solo hay que bajar el L.
Generar colores aleatorios parece trivial, pero esconde un problema real: los colores verdaderamente aleatorios en RGB tienden a ser opacos, sobresaturados y visualmente agresivos — el espacio RGB no es perceptualmente uniforme. Por eso los diseñadores suelen generar valores aleatorios en el espacio HSL con la saturación y la luminosidad fijas en un rango agradable, variando solo el matiz. La especificación CSS Color Level 4 introdujo el espacio OKLCH, perceptualmente uniforme: los colores con el mismo valor de luminosidad L parecen igualmente brillantes para el ojo humano — algo que ni el RGB ni el HSL garantizan. Para mockups rápidos, generación de paletas iniciales, marcadores de posición en wireframes o pruebas de contraste de accesibilidad, tener un generador de colores aleatorios a mano ahorra el tiempo que pasarías abriendo un editor gráfico para coger un hex cualquiera. Esta herramienta entrega los valores HEX listos para copiar.
Detalhamento técnico
Pontos frequentes
- Para que serve esta ferramenta?: Ela roda 100% no seu navegador: útil para validar, formatar ou converter dados no dia a dia de desenvolvimento.
- Meus dados são enviados a algum servidor?: O processamento é feito localmente via JavaScript. Não armazenamos o conteúdo que você cola nas caixas de texto.
- Posso usar em produção ou para dados reais?: Use por sua conta e risco. Para segredos (senhas, tokens), prefira ambientes controlados e políticas da sua empresa. E lembre sempre de revisar os conteúdos gerados. Nunca confie cegamente nas coisas que vê na internet.
Trecho para testar
- Há também o bloco "Exemplo de Código" com o trecho completo; use esse texto rápido para colar nos campos e validar: Exemplo — #3FA7D6
Technical deep dive
Common questions summarized
- What is this tool for?: It runs fully in your browser: useful to validate, format, or convert data in everyday development.
- Are my inputs sent to a server?: Processing happens locally with JavaScript. We do not store what you paste into the text areas.
- Can I use this for real production data?: Use at your own risk. For secrets (passwords, tokens), prefer controlled environments and your company policies. And always review the generated contents. Never trust blindly things you see on the internet.
Sample payload to try
- See also the larger "Code Snippets" sample; paste this excerpt to try locally: Example — #3FA7D6
Detalle técnico
Ideas claras antes de usar la herramienta
- ¿Para qué sirve esta herramienta?: Funciona por completo en tu navegador: sirve para validar, formatear o convertir datos en el día a día.
- ¿Se envían mis datos a algún servidor?: El procesamiento es local con JavaScript. No almacenamos lo que pegas en los campos de texto.
- ¿Puedo usarlo con datos reales en producción?: Úsalo bajo tu responsabilidad. Para secretos (contraseñas, tokens), prefiere entornos controlados y políticas internas. Recuerda de revisar los contenidos generados. Nunca confies ciegamente en cosas que ves en internet.
Fragmento corto para probar
- Debajo aparece también el ejemplo largo en "Fragmentos de Código"; pega esta versión corta: Ejemplo — #3FA7D6
Guia da ferramenta Tool guide Guía de la herramienta
-
O que é cor hexadecimal Código
#RRGGBBque representa componentes vermelho, verde e azul. -
O que a ferramenta faz Gera cores HEX aleatórias em lote, com opção de letras maiúsculas.
-
Por que usar Mockups rápidos, placeholders visuais e criação inicial de paletas.
-
What a hexadecimal color is A
#RRGGBBcode representing red, green, and blue components. -
What the tool does Generates random HEX colors in batches, with optional uppercase letters.
-
Why use it Quick mockups, visual placeholders, and starter palette ideas.
-
Qué es un color hexadecimal Código
#RRGGBBque representa componentes rojo, verde y azul. -
Qué hace la herramienta Genera colores HEX aleatorios por lote, con opción de letras en mayúsculas.
-
Por qué usarla Mockups rápidos, placeholders visuales y creación inicial de paletas.
Exemplo de Código Code Snippets Fragmentos de Código
#3FA7D6#3FA7D6#3FA7D6Exemplo Example Ejemplo
#3FA7D6Perguntas frequentes FAQ Preguntas frecuentes
Para que serve esta ferramenta?
What is this tool for?
¿Para qué sirve esta herramienta?
Ela roda 100% no seu navegador: útil para validar, formatar ou converter dados no dia a dia de desenvolvimento.
It runs fully in your browser: useful to validate, format, or convert data in everyday development.
Funciona por completo en tu navegador: sirve para validar, formatear o convertir datos en el día a día.
Meus dados são enviados a algum servidor?
Are my inputs sent to a server?
¿Se envían mis datos a algún servidor?
O processamento é feito localmente via JavaScript. Não armazenamos o conteúdo que você cola nas caixas de texto.
Processing happens locally with JavaScript. We do not store what you paste into the text areas.
El procesamiento es local con JavaScript. No almacenamos lo que pegas en los campos de texto.
Posso usar em produção ou para dados reais?
Can I use this for real production data?
¿Puedo usarlo con datos reales en producción?
Use por sua conta e risco. Para segredos (senhas, tokens), prefira ambientes controlados e políticas da sua empresa. E lembre sempre de revisar os conteúdos gerados. Nunca confie cegamente nas coisas que vê na internet.
Use at your own risk. For secrets (passwords, tokens), prefer controlled environments and your company policies. And always review the generated contents. Never trust blindly things you see on the internet.
Úsalo bajo tu responsabilidad. Para secretos (contraseñas, tokens), prefiere entornos controlados y políticas internas. Recuerda de revisar los contenidos generados. Nunca confies ciegamente en cosas que ves en internet.