---
title: "Sass Trick: Bewerk alle kleuren met een @each loop"
url: https://roadbearstudios.com/programmeren/sass-trick-bewerk-kleuren-met-each-loop/
canonical: https://roadbearstudios.com/programmeren/sass-trick-bewerk-kleuren-met-each-loop/
modified: 2020-02-13T12:27:10+01:00
lang: nl-NL
description: "Vind jij webdevelopment net zo leuk als wij? En schrijf je al je CSS in Sass? Dan hebben we hier een toffe truc voor de échte die-hards! Uiteraard gebruik je verschillende kleurtjes in je site. Deze kleuren komen op veel plekken terug en natuurlijk heb je dit allemaal netjes geordend in je _colors.scss bestand 🙂 […]"
---

# Sass Trick: Bewerk alle kleuren met een @each loop

Vind jij webdevelopment net zo leuk als wij? En schrijf je al je CSS in Sass? Dan hebben we hier een toffe truc voor de échte die-hards!

 

Uiteraard gebruik je verschillende kleurtjes in je site. Deze kleuren komen op veel plekken terug en natuurlijk heb je dit allemaal netjes geordend in je _colors.scss bestand 🙂

 

## Alle kleuren tegelijk een hover-state:

 

Wat nou als je, net als wij, al deze kleuren tegelijk een hover-state wilt meegeven. Omdat je bijvoorbeeld, net als wij, de kleurtjes hebt gebruikt voor tag-labels of categorie-labels. Dan zou het heel wat regeltjes CSS schelen wanneer je dit in 1 keer kunt doen. En wanneer je dus willekeurig welk kleurtje aan deze logica toe zou kunnen voegen toch?

 

Check de @each loop die we hiervoor gebruiken in Sass, zo blijft je ook je css lekker dynamisch, have fun!

 

See the Pen [SCSS darken all base colors at once in link list a:hover](https://codepen.io/vitavanderlijke/pen/XWWamrz) by Vita ([@vitavanderlijke](https://codepen.io/vitavanderlijke))  
 on [CodePen](https://codepen.io).