Skip to content

Add util() Sass mixin - #42630

Open
mdo wants to merge 1 commit into
v6-devfrom
mdo/util-mixin
Open

Add util() Sass mixin#42630
mdo wants to merge 1 commit into
v6-devfrom
mdo/util-mixin

Conversation

@mdo

@mdo mdo commented Jul 8, 2026

Copy link
Copy Markdown
Member

Adds a util() mixin—basically a native Sass @apply for our utilities. Pass it any utility class name (or a space-separated string) and it drops that utility's declarations straight into your own selector. No class in your markup, no !important.

A few things it does:

  • Works with multiple utilities at once: @include util(p-3, d-flex) or @include util("p-3 d-flex")
  • Reads the same $utilities map we generate classes from, so your own custom/extended utilities work too
  • Stays base-only on purpose—compose with media-breakpoint-up() and plain nesting for responsive and state variants
  • Errors on an unknown class name so typos fail at compile time

Comes with sass-true tests and a new docs page under Utilities (right below the API page).

Closes #33861, replaces #35465.

@mdo
mdo requested a review from a team as a code owner July 8, 2026 03:18
@mdo mdo added this to v6.0.0 Jul 8, 2026
@github-project-automation github-project-automation Bot moved this to Inbox in v6.0.0 Jul 8, 2026
@mdo mdo mentioned this pull request Jul 8, 2026
4 tasks
@mdo
mdo force-pushed the mdo/util-mixin branch from 00aae9a to d647312 Compare July 8, 2026 15:08
@mdo mdo removed this from v6.0.0 Aug 1, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant