:root { --colour-blue: #2e51a1, --colour-blue-l: #5c7abf, --colour-blue-xl: #b2c3ec, --colour-blue-d: #133176, --colour-blue-xd: #031235, --colour-grey: #7f7f7f, --colour-grey-l: #b2b2b2, --colour-grey-xl: #d8d8d8, --colour-grey-xxl: #f0f0f0, --colour-white: #fff, --colour-page: #fff, --colour-light: #fff, --colour-grey-d: #4c4c4c, --colour-grey-xd: #4c4c4c, --colour-black: #000, --colour-dark: #000, }
$colour: ( colour-blue: #2e51a1, colour-blue-l: #5c7abf, colour-blue-xl: #b2c3ec, colour-blue-d: #133176, colour-blue-xd: #031235, colour-grey: #7f7f7f, colour-grey-l: #b2b2b2, colour-grey-xl: #d8d8d8, colour-grey-xxl: #f0f0f0, colour-white: #fff, colour-page: #fff, colour-light: #fff, colour-grey-d: #4c4c4c, colour-grey-xd: #4c4c4c, colour-black: #000, colour-dark: #000, ); :root { @each $name, $color in $colour { --#{$name}: #{$color}; } }