HEX to RGBA Converter

function hexToRgba(hex: string, alpha: number = 1): string {
  let c = hex.replace('#', '');
  if (c.length === 3) {
    c = c.split('').map(x => x + x).join('');
  }
  const num = parseInt(c, 16);
  const r = (num >> 16) & 255;
  const g = (num >> 8) & 255;
  const b = num & 255;
  const a = Math.max(0, Math.min(1, alpha));
  return `rgba(${r}, ${g}, ${b}, ${a})`;
}

// Example usage:
console.log(hexToRgba('#3498DB', 0.75)); 
// "rgba(52, 152, 219, 0.75)"

def hex_to_rgba(hex_str: str, alpha: float = 1.0) -> str:
    h = hex_str.lstrip('#')
    if len(h) == 3:
        h = ''.join(c * 2 for c in h)
    r, g, b = (int(h[i:i+2], 16) for i in (0, 2, 4))
    a = max(0.0, min(1.0, alpha))
    return f"rgba({r}, {g}, {b}, {a:.2f})"

# Example:
print(hex_to_rgba("#17A2B8", 0.5))
# "rgba(23, 162, 184, 0.50)"

.glass-panel {
  background-color: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 16px;
}

<!-- Tailwind Opacity Modifiers -->
<div className="bg-[#3498DB]/75 backdrop-blur-md">
  Semi-transparent background with solid text
</div>

<!-- Arbitrary RGBA -->
<div className="bg-[rgba(52,152,219,0.5)]">
  Custom alpha container
</div>