PostCSS@PostCSS

PostCSS is a tool to transform styles with JS plugins. By @sitnikcode and @evilmartians.

postcss.org/
Joined November 2014
596 Photos and videos
Load newest
Replying to @alexander_akait
Parsing Tailwind — Slowest to fastest parse: CSSTree, PostCSS, untitled, Values. Least to most tokens: CSSTree, Values, PostCSS, untitled. Parsing Bootstrap — Slowest to fastest parse: CSSTree, untitled, PostCSS, Values. Least to most tokens: CSSTree, Values, PostCSS, untitled.
2
1
8
PostCSS retweeted
DevSammy@ImSammy1999
2 Sep 2021
SIlent Hill just stole @PostCSS Logo idea, change my mind.
1
3
I finished the CSS value parser, added parsing for declarations, and then shared the demo with anyone who asked. Which means my brain can now ignore the project entirely until someone actually needs it or is interested in working on it with me.
2
1
8
PostCSS retweeted
Justin@JJAllenTech
1 Sep 2021
"Greetings, time traveller. We are in the golden age of prefix-less CSS, where Autoprefixer is no longer needed for your stylesheet." Nice!
2
1
PostCSS retweeted
Bogdan@IAmTrySound
1 Sep 2021
New errors are coming in the next SVGO version! Big thanks to postcss for inspiration! github.com/svg/svgo/pull/155…
SvgoParserError: test.svg:2:29: Unquoted attribute value 1 | <svg viewBox="0 0 120 120"> > 2 | <circle fill="#ff0000" cx=60.444444" cy="60" r="50"/> | ^ 3 | </svg> 4 |

ALT SvgoParserError: test.svg:2:29: Unquoted attribute value 1 | <svg viewBox="0 0 120 120"> > 2 | <circle fill="#ff0000" cx=60.444444" cy="60" r="50"/> | ^ 3 | </svg> 4 |

2
4
20
Congratulation to @PostCSS on reaching 25,000 stars on GitHub. Great achievement PostCSS is a tool for transforming styles with JS plugins. These plugins can lint your CSS, support variables and mixins, transpile future CSS syntax, inline images and more github.com/postcss/postcss
4
15
PostCSS retweeted
Joy@Joy_in_Tech
27 Aug 2021
github.com/postcss/autoprefi… Write regular CSS and let @Autoprefixer take care of all your browser prefixes!👏👏👏 Try it here: autoprefixer.github.io #CodeNewbie #webdev #coding

GitHub - postcss/autoprefixer: Parse CSS and add vendor prefixes to rules by Can I Use

Parse CSS and add vendor prefixes to rules by Can I Use - postcss/autoprefixer

github.com
4
7
Replying to @giuseppegurgone
We have something very sneaky in @stitchesjs, which given time I would make into a PostCSS plugin. Any number with a custom unit becomes an expression using the custom property of the same name. Paired with @​property, this is my favorite hypothetical solution thus far.
The following CSS: ``` html { --rpx: .0625rem; } body { font-size: 16--rpx; } ```

ALT The following CSS: ``` html { --rpx: .0625rem; } body { font-size: 16--rpx; } ```

The following CSS after transformation: ``` html { --rpx: .0625rem; } body { font-size: calc(16 * var(--rpx)); } ```

ALT The following CSS after transformation: ``` html { --rpx: .0625rem; } body { font-size: calc(16 * var(--rpx)); } ```
2
26
PostCSS retweeted
PostCSS@PostCSS
21 Aug 2021
Autoprefixer 10.3.2 was released. @usmanyunusov fixed ::file-selector-button support. github.com/postcss/autoprefi… Release’s knight by @malintfalch.
5
4
PostCSS retweeted
LogRocket
@LogRocket
17 Aug 2021
Level up your CSS linting using Stylelint blog.logrocket.com/using-sty… #CSS #webdev
3
4
"This indicates that systems like Svelte, CSS Modules, or good old-fashioned BEM are using the best approach performance-wise." nolanlawson.com/2021/08/15/d…
5
72
307
How have I survived this long without using @stylelint?!?
1
2
But, the majority of the error pages from stylelint have nice clear explanations about why you should do it, and I don't get a lot of OCD spacing BS like with eslint. Most of the spacing rules are reasonable and the ones that aren't are fewer than eslint.
1
1
2
Replying to @emmydoesit
Yeah I’d recommend it! Linting can help call out the simple things that could break your code. I use it with Ruby, JS, and Python. Never used it with CSS but I did find one called stylelint stylelint.io
2
2
Replying to @giovannibenussi @argyleink
Media query ranges, her you can see a @PostCSS plugin and link to spec preset-env.cssdb.org/feature…
1
2
A great primer to native nesting in #CSS and how selector specificity is affected by it, by @kilianvalkhof Yes, this is cutting edge and has no browser support yet. But it's very exciting & you can start using it today if you use PostCSS. kilianvalkhof.com/2021/css-h…
2
13
61
PostCSS retweeted
Adam Argyle
@argyleink
9 Aug 2021
Here's a few that travel with me across projects! but this one I use the most: ```#css @custom-media --motionOK (prefers-reduced-motion: no-preference);
Stefan Judis@stefanjudis
8 Aug 2021
Today I learned that the CSS media query spec defines custom media queries (aka reusable variables for media queries). Unfortunately, it doesn't seem to be support anywhere. 😢 Can we have that please? 🙈 stefanjudis.com/notes/can-we…
CSS code: @custom-media --narrow-window (max-width: 30em); @media (--narrow-window) { /* narrow window styles */ }

ALT CSS code: @custom-media --narrow-window (max-width: 30em); @media (--narrow-window) { /* narrow window styles */ }

1
9
46
PostCSS is a program that automates routine CSS operations using JavaScript extensions. Unlike Sass and LESS, PostCSS is not a templating language compiled to CSS. PostCSS is a platform on which you can create various tools for working with CSS #100DaysOfCode
3
1
Exploring container queries using @jon_neal's CQFill polyfill and grid. codepen.io/cahdeemer/pen/Exm… via @CodePen
2
9
Load more