ITADN

Minimal support for @mixin and @apply

#1754Closedmindplay-dk 创建于 2026-01-03
feature request
M
mindplay-dkcommented
### What would you want to propose? Would you consider supporting bare minimum CSS `@mixin` and `@apply` as proposed by the W3C [CSS Custom Functions and Mixins Module Level 1](https://drafts.csswg.org/css-mixins-1/#defining-mixins) draft? ```css @mixin --center-content { display: grid; place-content: center; } body { @apply --center-content; /* display: grid; place-content: center; */ } ``` It's a *big* proposal, but even if nothing more than this is supported, it would already be a huge win for design systems. Even it just this is supported with no functions, arguments, setting variables, `@contents`, `@env` etc. it would already be a huge step up for things like typography, for which there is currently no good standard solution. Typographies often have 10+ properties, and there is sadly, still to this day, no good way to simlpy reuse a set of properties with native CSS. I know about [`postcss-mixins`](https://github.com/postcss/postcss-mixins) but it is non standard and will be superseded by this standard, but I expect it could be years still before we have this. In the mean time, everyone is reaching for tailwind or CSS-in-JS or SASS just for such a little thing, and they are getting *way* more complexity than they bargained for. I honestly feel like this is last big pain point for standard CSS. I don't even care about functions or the rest of mixins features - I really just need a way to create reusable typographies, and it is one of the last reasons I'd reach for any of those other tools. Happy new year to you all. 🙂 ### Suggested solution I would be happy with even the most basic implementation of this, e.g. `@apply` would simply copy the properties defined by `@mixin`. This basic feature already goes a long way in SASS and CSS-in-JS etc. - it would just be nice if we could start using the syntax from the upcoming standard already, since `@function` is landing in browsers now, and these directives are part of the same standard. ### Additional context _No response_ ### Validations - [x] Follow our [Code of Conduct](https://github.com/csstools/postcss-plugins/blob/master/CODE_OF_CONDUCT.md) - [x] Check that there isn't already an issue that request the same feature to avoid creating a duplicate. ### Would you like to open a PR for this feature? - [ ] I'm willing to open a PR
关闭于 2026-01-14 2 条评论