.u-color

scss
.u-color {
  @each $color, $variations in $chattigo-palette {
    @include element($color) {
      color: use-color($color);

      @each $variation, $value in $variations {
        @include modifier($variation) {
          color: use-color($color, $variation);
        }
      }
    }
  }
}

Clases de ayuda para modificar el color de los elementos.

Examples

html Base color
<h1 class="u-color__primary">Color primary</h1>
<h1 class="u-color__secondary">Color secondary</h1>
<h1 class="u-color__complementary">Color complementary</h1>
<h1 class="u-color__grey">Color grey</h1>
html Color with variations
<h1 class="u-color__primary--dark">Color primary dark</h1>
<h1 class="u-color__primary--base">Color primary base</h1>
<h1 class="u-color__primary--light">Color primary light</h1>
<h1 class="u-color__primary--light-alt">Color primary light-alt</h1>

Requires

@function use-color()