Session Spotlight

Decoding Colors: A Deep Dive into Hex and RGB(A) Color Models

If you’re a developer (or a former MySpace user), there’s a 99.999% chance you’ve added a hex color to your site, and you’ve likely used RGBA to add a color with opacity. Color pickers provide a convenient way to select colors in the format(s) you need, but have you ever wondered what the letters and numbers in hexes represent, and how they translate to RGB? Having a deeper comprehension of CSS color theory will improve your development, accessibility, and design skills. During this talk we’ll discuss: - An overview of the Red Green Blue (and Alpha) model - An explanation of the hex model and what the letters and numbers in a hex represent (and how they relate to the RGB model). - Why colors are important for accessibility. - The formula used to dynamically create consistent color schemes with RGB. - How to programmatically convert between the RGB and hex models. - Practical examples of the concepts, including: - Determining text or element color based on the background. - Creating components with multiple colors while maintaining a specific (and accessible) color ratio. You’ll leave this talk with a deeper understanding of the hex and RGB(A) color models, along with advanced techniques for color manipulation and how to use these techniques to ensure your components have accessible colors. A repository link to the code examples will be provided so you can further explore the concepts discussed.