Color Converter: Hex, RGB, and HSL

This challenge asks you to build a JavaScript function that can convert between hexadecimal (hex), RGB (Red, Green, Blue), and HSL (Hue, Saturation, Lightness) color representations. Color conversion is a fundamental task in web development and graphics programming, enabling flexible color manipulation and standardization.

Problem Description

You need to create a JavaScript object with three methods: hexToRgb, rgbToHex, rgbToHsl, and hslToRgb. Each method should take a color value in one format as input and return the equivalent color value in the specified output format.

Key Requirements:

• hexToRgb(hex): Converts a hexadecimal color code (e.g., "#FF0000") to an RGB tuple (e.g., {r: 255, g: 0, b: 0}).
• rgbToHex(rgb): Converts an RGB tuple (e.g., {r: 255, g: 0, b: 0}) to a hexadecimal color code (e.g., "#FF0000").
• rgbToHsl(rgb): Converts an RGB tuple (e.g., {r: 255, g: 0, b: 0}) to an HSL object (e.g., {h: 0, s: 100, l: 50}). Hue should be in degrees (0-360), Saturation and Lightness in percentages (0-100).
• hslToRgb(hsl): Converts an HSL object (e.g., {h: 0, s: 100, l: 50}) to an RGB tuple (e.g., {r: 255, g: 0, b: 0}).

Expected Behavior:

• The functions should handle valid color inputs correctly.
• The functions should return appropriate values in the specified format.
• The functions should be robust and handle invalid inputs gracefully (see Edge Cases).

Edge Cases to Consider:

• Invalid Hex Codes: The hexToRgb function should handle invalid hex codes (e.g., codes with incorrect length, invalid characters) by returning null or throwing an error.
• Invalid RGB Values: The rgbToHex and rgbToHsl functions should handle RGB values outside the range of 0-255 by clamping them to the range.
• Invalid HSL Values: The hslToRgb and rgbToHsl functions should handle HSL values outside the range of 0-100 (for Saturation and Lightness) and 0-360 (for Hue) by clamping them to the range.
• Case-Insensitivity (Hex): The hexToRgb function should be case-insensitive when parsing hex codes (e.g., "#ff0000" should be treated the same as "#FF0000").

Examples

Example 1:

Input: hexToRgb("#FF0000")
Output: {r: 255, g: 0, b: 0}
Explanation:  Red color in hex format converted to RGB.

Example 2:

Input: rgbToHex({r: 0, g: 0, b: 0})
Output: "#000000"
Explanation: Black color in RGB format converted to hex.

Example 3:

Input: rgbToHsl({r: 255, g: 0, b: 0})
Output: {h: 0, s: 100, l: 50}
Explanation: Red color in RGB format converted to HSL.

Example 4:

Input: hslToRgb({h: 120, s: 50, l: 50})
Output: {r: 128, g: 191, b: 128}
Explanation: Green color in HSL format converted to RGB.

Example 5:

Input: hexToRgb("invalidHex")
Output: null
Explanation: Handles invalid hex code input.

Constraints

• Hex Codes: Hex codes should be 3 or 6 characters long (excluding the '#'). The function should handle both 3 and 6 character hex codes correctly.
• RGB Values: RGB values should be integers between 0 and 255, inclusive.
• HSL Values: Hue should be a number between 0 and 360, inclusive. Saturation and Lightness should be numbers between 0 and 100, inclusive.
• Performance: The conversion functions should be reasonably efficient. While micro-optimizations are not required, avoid unnecessarily complex or inefficient algorithms.

Notes

• You can use helper functions to break down the conversion logic into smaller, more manageable pieces.
• Consider using mathematical formulas for accurate color conversions. There are many resources available online that describe these formulas.
• Focus on clarity and readability in your code. Well-commented code is always appreciated.
• Remember to handle edge cases and invalid inputs gracefully. This is a key aspect of writing robust code.
• The HSL to RGB and RGB to HSL conversions can be a bit tricky. Take your time and test thoroughly.