meta.apply($mixin, $args...) is a mixin that includes a mixin value with the given arguments. If you pass a @content block to @include meta.apply(...), that content is forwarded to $mixin. Load it with @use "sass:meta" on Dart Sass 1.69+.
Build an apply-to-all helper that loops a list and calls @include meta.apply($mixin, $element) for each item—for example generating .font-8px, .font-12px, and .font-2rem.
Pass a value from meta.get-mixin() or meta.module-mixins()—not a plain string name.
Use @include meta.apply(...). It emits CSS; it does not return a value.
@use "sass:meta";
@include meta.apply($mixin, $args...);
@include meta.apply($mixin, $args...) { /* forwarded @content */ }
@mixin font-class($size) {
.font-#{$size} { font-size: $size; }
}
@include meta.apply(meta.get-mixin("font-class"), 12px);
// Module API — prefer meta.apply after @use "sass:meta"Pattern: resolve a mixin value → @include meta.apply with args → optionally forward @content. Check meta.accepts-content first when content is optional.
Same dynamic idea, different member types:
| Helper | Runs | How you use it |
|---|---|---|
meta.apply | Mixin value | @include meta.apply(...) — emits CSS / can take @content |
meta.call | Function value | Expression / assignment — returns a value |
meta.get-mixin | — | Builds the mixin value you apply |
meta.get-function | — | Builds the function value you call |
If the target mixin cannot accept @content, do not pass a content block—or guard with meta.accepts-content.
Examples target Dart Sass 1.69+ with @use "sass:meta". Open View Compiled CSS for verified output (matches official Sass docs samples where shown).
Resolve the mixin, then include it with one argument.
@use "sass:meta";
@mixin font-class($size) {
.font-#{$size} {
font-size: $size;
}
}
@include meta.apply(meta.get-mixin("font-class"), 12px);get-mixin returns a mixin value.meta.apply includes it with 12px.@include font-class(12px), but dynamic.apply-to-allLoop a list and apply the same mixin to each element.
@use "sass:meta";
/// Passes each element of $list to a separate invocation of $mixin.
@mixin apply-to-all($mixin, $list) {
@each $element in $list {
@include meta.apply($mixin, $element);
}
}
@mixin font-class($size) {
.font-#{$size} {
font-size: $size;
}
}
$sizes: 8px, 12px, 2rem;
@include apply-to-all(meta.get-mixin("font-class"), $sizes);@each walks every size.meta.apply runs font-class per item.@content BlockContent passed to meta.apply is forwarded into the target mixin.
@use "sass:meta";
@mixin with-content {
.inner {
@content;
}
}
.wrap {
@include meta.apply(meta.get-mixin("with-content")) {
color: red;
}
}@content.meta.apply.color: red under .inner.accepts-contentOnly forward a content block when the mixin can take one.
@use "sass:meta";
@mixin plain {
color: blue;
}
@mixin with-content {
.inner {
@content;
}
}
@mixin apply-if-content($mixin) {
@if meta.accepts-content($mixin) {
@include meta.apply($mixin) {
outline: 1px solid red;
}
} @else {
@include meta.apply($mixin);
}
}
.a {
@include apply-if-content(meta.get-mixin("plain"));
}
.b {
@include apply-if-content(meta.get-mixin("with-content"));
}Extra args after the mixin value are forwarded to the mixin signature.
@use "sass:meta";
@mixin card($pad, $radius) {
.card {
padding: $pad;
border-radius: $radius;
}
}
@include meta.apply(meta.get-mixin("card"), 1rem, 8px);1rem and 8px fill $pad and $radius.Most apply bugs are string names, wrong include syntax, or content forwarding into plain mixins.
meta.apply("font-class", 12px) fails. Use meta.get-mixin("font-class").
@includemeta.apply is a mixin. Do not assign its result like a function.
Guard with meta.accepts-content when content is optional.
meta.callDynamic functions return values via meta.call, not meta.apply.
Prefer the module form with Dart Sass 1.69+.
| API | Status |
|---|---|
meta.apply() | Dart Sass 1.69+ via @use "sass:meta" |
| Kind | Mixin (use with @include) |
| First argument | Mixin value (e.g. from meta.get-mixin) |
| LibSass / Ruby Sass | Not available |
Compile with the Dart Sass CLI.
@content when you pass a content block.@use "sass:meta".One line: when a mixin value must be included dynamically (with optional content), call @include meta.apply($mixin, $args...).
Practical checklist:
1. @use "sass:meta"
2. Resolve a mixin value (get-mixin / module-mixins)
3. @include meta.apply($mixin, $args...)
4. Optionally forward @content (guard with accepts-content)
5. Use meta.call for function valuesInspect the arguments inside a CSS calculation value.
8 people found this page helpful