3 ms·

for haters, color management is a good starting example of why it's good. https://tailwindcss.com/docs/customizing-colors https://tailwindcss.com/docs/customiz

for haters, color management is a good starting example of why it's good. https://tailwindcss.com/docs/customizing-colors https://tailwindcss.com/docs/customizing-colors

lolinder 4y ago
Color management is easy in SCSS, too, though. I just have a _colors.scss file and enforce that no color is ever used that isn't in that file. If I'm working with a designer rather than designing my own UIs, that they have a default color palette isn't helpful, so what do I gain from Tailwind? EDIT: Reading some other comments, I wonder if part of the reason I don't see the utility is that I use Vue, not React. It sounds like Tailwind solves a lot of the same problems that Vue+SCSS does.
- bpicolo 4y ago
  One good part is the generated classes for every color. Background colors, font colors, border colors... everything in the color palette is usable as `bg-blue-500`, `text-blue-500`, `border-blue-500` etc. Could be reproduced in css for sure, but it's a great set of defaults that you can utilize cross-repo. Standardization is a powerful concept.
- ramesh31 4y ago
  The killer for SASS nowadays is CI. You're either using the (ancient, slow) Ruby implementation of SASS, or node-sass which requires a native binary build and causes headaches across environments. Furthermore, with Post-CSS, the feature set of SASS has been completely subsumed by the latest CSS standard. There's really no good reason to use it anymore.
  - toastal 4y ago
    It's Sass, not SASS. The native libsass is much faster. The headaches come from people trying to distribute binaries and libraries through NPM.
    - jbenner-radham 4y ago
      If we're being pedantic technically it's npm and not NPM ;)
      - toastal 4y ago
        Oof. I did not know this one. > npm (originally short for Node Package Manager) Acronyms can make sense to switch case, but initialisms... en-pee-em... I guess it happens. I originally was introduced it as Node Package Manager, but I'm gonna make an effort to correct this now.
  - no_wizard 4y ago
    You should really be using the dart-sass[0] build (just `sass` on npm). None of the headaches of native binaries or using ruby, its pure JavaScript (its a dart codebase transpiled to JS). It is very fast. [0]: https://sass-lang.com/documentation/#older-versions https://sass-lang.com/documentation/#older-versions
    - ramesh31 4y ago
      >[0]: https://sass-lang.com/documentation/#older-versions https://sass-lang.com/documentation/#older-versions This is awesome, really glad to see things have progressed from the node-sass days. Might have to give it another look.
  - Rapzid 4y ago
    For large apps yes; all Sass compile options are slow with embedded Sass being the least slow BUT: Does your tooling even support embedded Sass?! Vite does not. Our version of webpack does not.. The Cenobites would LOVE Sass; never ending performance pain.
- andrei_says_ 4y ago
  Including Tailwind’s list of colors in an scss codebase is trivial. Same for spacing and font sizes if you need these standardized and haven’t done it already. Which we always did way before tailwind was invented.

for haters, color management is a good starting example of why it's good. https://tailwindcss.com/docs/customizing-colors https://tailwindcss.com/docs/customizing-colors

lolinder 4y ago

Color management is easy in SCSS, too, though. I just have a _colors.scss file and enforce that no color is ever used that isn't in that file. If I'm working with a designer rather than designing my own UIs, that they have a default color palette isn't helpful, so what do I gain from Tailwind? EDIT: Reading some other comments, I wonder if part of the reason I don't see the utility is that I use Vue, not React. It sounds like Tailwind solves a lot of the same problems that Vue+SCSS does.

bpicolo 4y ago
One good part is the generated classes for every color. Background colors, font colors, border colors... everything in the color palette is usable as `bg-blue-500`, `text-blue-500`, `border-blue-500` etc. Could be reproduced in css for sure, but it's a great set of defaults that you can utilize cross-repo. Standardization is a powerful concept.
ramesh31 4y ago
The killer for SASS nowadays is CI. You're either using the (ancient, slow) Ruby implementation of SASS, or node-sass which requires a native binary build and causes headaches across environments. Furthermore, with Post-CSS, the feature set of SASS has been completely subsumed by the latest CSS standard. There's really no good reason to use it anymore.
- toastal 4y ago
  It's Sass, not SASS. The native libsass is much faster. The headaches come from people trying to distribute binaries and libraries through NPM.
  - jbenner-radham 4y ago
    If we're being pedantic technically it's npm and not NPM ;)
    - toastal 4y ago
      Oof. I did not know this one. > npm (originally short for Node Package Manager) Acronyms can make sense to switch case, but initialisms... en-pee-em... I guess it happens. I originally was introduced it as Node Package Manager, but I'm gonna make an effort to correct this now.
- no_wizard 4y ago
  You should really be using the dart-sass[0] build (just `sass` on npm). None of the headaches of native binaries or using ruby, its pure JavaScript (its a dart codebase transpiled to JS). It is very fast. [0]: https://sass-lang.com/documentation/#older-versions https://sass-lang.com/documentation/#older-versions
  - ramesh31 4y ago
    >[0]: https://sass-lang.com/documentation/#older-versions https://sass-lang.com/documentation/#older-versions This is awesome, really glad to see things have progressed from the node-sass days. Might have to give it another look.
- Rapzid 4y ago
  For large apps yes; all Sass compile options are slow with embedded Sass being the least slow BUT: Does your tooling even support embedded Sass?! Vite does not. Our version of webpack does not.. The Cenobites would LOVE Sass; never ending performance pain.
andrei_says_ 4y ago
Including Tailwind’s list of colors in an scss codebase is trivial. Same for spacing and font sizes if you need these standardized and haven’t done it already. Which we always did way before tailwind was invented.