Sass 3

lighten, darkenなどが使える

$brandColor: red;

#main {
	width: 90%;
	p {
		color: lighten($brandColor, 30%);
		font-size: 16px;
	}
}

#main {
  width: 90%;
}
#main p {
  color: #ff9999;
  font-size: 16px;
}

sass module
https://sass-lang.com/documentation/modules

if文

$debugMode: true;

#main {
	@if $debugMode == true {
		color: red;
	} else {
		color: green;
	}
}

for

@for $i from 10 through 14 {
.fs#{$i} {font-size: #{$i}px;}
}
$i: 10;
@while $i <= 14 { .fs#{$i} {font-size: #{$i}px;} $i: $i +1; } [/css] [css] $animals: cat, dog, tiger; @each $animal in $animals { .#{$animal}-icon { background: url("#{$animal}.png"); } } [/css]