> For the complete documentation index, see [llms.txt](https://spectrecss.angular-package.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://spectrecss.angular-package.dev/mixin/var/define-color.md).

# ⚠ define-color()

{% hint style="danger" %}
**Deprecated**: This feature is no longer recommended. Avoid using it, and update existing code if possible. Be aware that this feature may cease to work at any time.ccc
{% endhint %}

{% code title="" lineNumbers="true" %}

```scss
// @deprecated
// The mixin defines CSS variable color in hsla form, by splitting it in four CSS
// variables.
@mixin define-color($name, $color, $prefix: $var-prefix, $alpha: -1) {
  @warn 'define-color() mixin is deprecated in favor of set-color(), which includes new customizations';
  @include set-var($name, hue($color), $prefix, 'h');
  @include set-var($name, saturation($color), $prefix, 's');
  @include set-var($name, lightness($color), $prefix, 'l');
  @if $alpha == -1 {
    @include set-var($name, alpha($color), $prefix, 'a');
  } @else {
    @include set-var($name, $alpha, $prefix, 'a');
  }
}
```

{% endcode %}