css-challenges

← overzicht

CSS challenge 9: high-def colors

🗓️ ⸺ Dinsdag 11 februari
⏰ ⸺ 9:30 - ca 11:30 uur
🙋 ⸺ even aanmelden - max 24

📗 ⸺ high-def colors intro (pdf 6MB)

Oefening 1: 🎨 colors

Maak de blokes na. Oefenen met high-def colors en gradients (en @supports en @media).

🧑‍💻 ⸺ Code voor jou (CodePen)
🧑‍💻 ⸺ Voorbeeld/Uitwerking (CodePen)

Oefening 2: 🌈 (moving) gradients

Bewegende gradients en borders.

🧑‍💻 ⸺ Code voor jou (CodePen)
🧑‍💻 ⸺ Voorbeeld/Uitwerking (CodePen)

Oefening 3: 🤪 Omdat het kan

Lekker de grenzen verkennen.

🧑‍💻 ⸺ Code voor jou (CodePen)
🧑‍💻 ⸺ Voorbeeld/Uitwerking (CodePen)

🎯 ⸺ oklch mixer (evil martians 🧑‍💻)
🎯 ⸺ color-mix (developer.chrome.com 🦖)
🎯 ⸺ animate gradients (css tricks 🪄)
🎯 ⸺ @property (MDN 🦊)
🎯 ⸺ border-image (css tricks 🪄)

This site is open source. Improve this page.