webdle
day 2
Build an interactive color palette generator that creates five random color shades. Users can lock individual colors to keep them while regenerating others. This challenge focuses on DOM manipulation, event handling, and random color generation.

Requirements:
- Create a container with class `palette-container` that holds exactly 5 color tiles
- Each color tile must have class `color-tile` and display:
- A colored background showing the hex color
- The hex code text (e.g., "#A3C2F5") with class `hex-code`
- A lock button with class `lock-btn` that toggles between locked/unlocked states
- Lock buttons must visually indicate their state (use "🔒" for locked and "🔓" for unlocked as text content)
- Add a "Generate" button with class `generate-btn` that regenerates unlocked colors
- When the spacebar key is pressed, trigger regeneration (same as clicking Generate button)
- Locked tiles must keep their exact hex color when regenerating
- Unlocked tiles must get new random hex colors when regenerating
- Initialize with 5 random colors on page load
- Generated colors should be valid 6-digit hex codes (e.g., #A1B2C3)
Preview
Tests