HEX to RGBA Converter
Convert HEX color codes to RGBA format with transparency support. RGBA extends RGB by adding an alpha channel for controlling opacity, essential for overlays, shadows, and transparent design elements.
Understanding RGBA
RGBA adds a fourth value to RGB—the alpha channel:
- R: Red (0-255)
- G: Green (0-255)
- B: Blue (0-255)
- A: Alpha/Opacity (0-1 or 0%-100%)
HEX to RGBA Conversion
Standard 6-character HEX (#RRGGBB) converts to RGB with alpha manually specified:
| HEX | RGBA (50% transparent) |
|---|---|
| #FF0000 | rgba(255, 0, 0, 0.5) |
| #0000FF | rgba(0, 0, 255, 0.5) |
| #333333 | rgba(51, 51, 51, 0.5) |
| 8-Digit HEX | RGBA |
|---|---|
| #FF000080 | rgba(255, 0, 0, 0.5) |
| #0000FF40 | rgba(0, 0, 255, 0.25) |
| #00FF00FF | rgba(0, 255, 0, 1) |
Common RGBA Use Cases
| Use Case | Example |
|---|---|
| Modal overlay | rgba(0, 0, 0, 0.5) |
| Button hover | rgba(255, 255, 255, 0.1) |
| Text shadow | rgba(0, 0, 0, 0.3) |
| Glass effect | rgba(255, 255, 255, 0.2) |
CSS RGBA Syntax
``css
.overlay {
background-color: rgba(0, 0, 0, 0.7);
}
.glass {
background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(10px);
}
``
Use this converter to add transparency to your HEX colors for modern UI designs.