Mixin, selector, function naming conventions

Sass' naming conventions are inherited from CSS. Lowercase, hyphen-separated names, like the following function examples, are considered standard.

@mixin text-format($size, $family, $color) {
  font: {
    size: $size;
    family: $family;
  };
  color: $color;
}

.site-header {
  @include text-format(12px, verdana, red);
}

While this may be preferred, you will see many examples out there using underscores example_name as well camel case exampleName or Pascal case ExampleName, there is no right or wrong here. As long as you are consistent in your naming convention, that's what really matters.

A word of caution. When naming mixins, but sure to always be consistent with using either dashes -, or underscores _. I am not sure if this is a bug or a feature, but when importing mixins, the dash and underscore can be used interchangeably with the same name and it will work.

In the following example I will crate a mixin and name it using a dash -. But in the selector below, I will include the mixin using an underscore _. The result will be the mixin will process into the selector without issue.

=block-mixin
  background: green
.block
  +block_mixin

The resulting CSS

.block {
  background: green;
}