Cómo usar esta calculadora
What the two notations mean
Hex and rgb() are two spellings of the same thing: three channel values that say how much red, green, and blue a color mixes. A hex code like #3498db is the three channels written in base 16 — the pairs 34, 98, db — while rgb(52, 152, 219) writes the same numbers in decimal. The converter is pure arithmetic on those channels: each hex pair is parsed with parseInt(·, 16) and each decimal channel is converted back to two base-16 digits, so the two forms are always exact, never approximated.
That is the tool’s entire job, and it is why the conversion is instant and lossless: #3498db is rgb(52, 152, 219), and rgb(52, 152, 219) is #3498db, with nothing lost in either direction. The hex form is the compact notation style guides and design systems use; the rgb() form is what many charting libraries, canvas APIs, and older CSS code expect.
The input forms that just work
Values copied out of a browser inspector, a design tool, or a mockup arrive in different shapes, and the converter accepts them as pasted: a 6-digit code, a 3-digit shorthand like #fff (which expands to #ffffff, matching CSS behavior), an optional leading #, uppercase or lowercase digits, and even the full function syntax rgb(52, 152, 219) or a bare triplet 52, 152, 219. Output is always normalized to the unambiguous 6-digit lowercase hex form, so the result never carries the ambiguity of shorthand.
Validation is strict about what a color can be: hex digits must be valid hex, and each RGB channel must be an integer from 0 to 255. A triplet with a channel of 300 is rejected with a clear message rather than silently clamped — CSS clamps out-of-range values, but a conversion tool should not invent a color the input did not describe.
Why the precedence rule exists
When both fields are filled, the hex value wins and converts to RGB; the rgb field is ignored. The rule is documented rather than guessed because a converter that silently picked a side would produce a result that disagreed with what the user intended to change. The behavior is predictable: edit the field you want to be authoritative, and the other side updates to match.
The same predictability applies to case and formatting: hex output is always lowercase because hex digits are case-insensitive and lowercase is the convention most tooling and minifiers use, and shorthand input always expands to the full form so the result is unambiguous.
The honest limits
The converter handles three-channel colors only: 4- and 8-digit hex (#rgba, #rrggbbaa) and rgba() carry an alpha channel this tool does not parse, and named CSS colors (red, blue, rebeccapurple) are not accepted — convert those by looking up their hex or rgb form first. For colors with transparency, convert the 6-digit base color here and keep the alpha separately. And as with everything on the site, the conversion runs entirely in your browser: no value you enter is uploaded, logged, or stored.
Preguntas frecuentes
¿Cuál es la diferencia entre hex de 3 y 6 dígitos?
Un código de 3 dígitos como #fff es la forma abreviada de CSS: cada dígito se duplica, así que #fff significa #ffffff. Todo navegador moderno lo admite. El convertidor acepta ambas y siempre emite la forma completa de 6 dígitos, para que el resultado no sea ambiguo.
¿Manejan valores alfa (transparencia)?
Todavía no. El hex de 8 dígitos (#rrggbbaa) y rgba() llevan un canal de transparencia que este convertidor no interpreta. Para colores con alfa, convierta el color base de 6 dígitos aquí y mantenga el alfa por separado.
¿Por qué la salida hex está en minúsculas?
Los dígitos hex no distinguen mayúsculas — #3498db y #3498DB son el mismo color. Las minúsculas son la convención de la mayoría de las herramientas y minificadores modernos, y mantienen la salida coherente para copiar y pegar.
¿Qué ocurre si lleno los campos hex y RGB?
El valor hex gana y se convierte a RGB; el campo RGB se ignora. La herramienta documenta esta precedencia en lugar de adivinar, de modo que el resultado siempre es predecible.
Why is #fff the same color as #ffffff?
CSS 3-digit shorthand doubles each digit: #fff means #ff ff ff, which is exactly #ffffff. The converter accepts both and always outputs the expanded 6-digit form, so the result is unambiguous.
Is 300, 0, 0 ever a valid color?
No — each channel must be an integer from 0 to 255. CSS clamps out-of-range values silently; this converter rejects them with an error instead, because converting a value that was not a color would produce a misleading result.