sass mixin with arguments code example

Example 1: scss @mixin base

@mixin rtl($property, $ltr-value, $rtl-value) {
  #{$property}: $ltr-value;

  [dir=rtl] & {
    #{$property}: $rtl-value;
  }
}

.sidebar {
  @include rtl(float, left, right);
}

Example 2: scss variables mixins

// styles.scss
@use 'base';

.inverse {
  background-color: base.$primary-color;
  color: white;
}