Skip to content

Instantly share code, notes, and snippets.

@chriskirknielsen
Last active March 26, 2018 21:01
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save chriskirknielsen/d349d1b4ba0a0b95c4fac091044fe4e1 to your computer and use it in GitHub Desktop.
Save chriskirknielsen/d349d1b4ba0a0b95c4fac091044fe4e1 to your computer and use it in GitHub Desktop.
SCSS function to return a colour from a list, in hexidecimal or rgba value
$colors: ( // Define a list of colours to use
'main': #00a39b,
'secondary': #cf0079,
'light': #e6e6e6,
'gray': #686868,
'dark': #161616
);
/** SCSS function to return a colour from a list, in hexidecimal or rgba value
* @param name: key used in the $colors list associated with a hexadecimal colour
* @param opacity: opacity value [0, 100] to be used by the rgba() colour; hex (default) to get the solid colour in hexadecimal value
**/
@function colomapa($name, $opacity: hex) {
@if map-has-key($colors, $name) { // If the colour exists in the list…
@if $opacity != hex { // …return RGBA value
$opacity-decimal: $opacity/100;
@return rgba(map-get($colors, $name), $opacity-decimal);
}
@else { // …returns hexidecimal value
@return map-get($colors, $name);
}
}
@else { // Return a CSS colour keyword in case it exists
@return unquote($name);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment