5 MORE TailwindCSS Tips I Wish I Learned Earlier

Рет қаралды 12,143

Күн бұрын

Animated UI components for React, Tailwind CSS, Framer Motion & More ✨ www.hover.dev
TailwindCSS is an amazing tool, and one of the best parts is its easy learning curve. Type in a style with a tailwind intellisense extension installed, and you'll more than likely find the class you're looking for.
BUT, Tailwind ALSO provides a number of utility classes that go beyond your normal CSS styles.
We covered 8 of these in a previous video, and today we'll talk about 5 more of these classes that I wish I'd found MUCH earlier.
#tailwindcss #webdevelopment
📚 Video Links
Source code: gist.github.com/TomIsLoading/...
Tailwind Plugins: tailwindcss.com/docs/plugins
Credit for original bg grid plugin: gist.github.com/jordienr/abb8...
🔗 My Links
TikTok: / tomisloading
Instagram: / tomisloading
GitHub: github.com/TomIsLoading
Twitter: / tomisloading
Discord & more: linktr.ee/tomisloading
Portfolio templates: tomisloading.gumroad.com/
0:00 - Introduction
0:05 - Size
0:25 - Group & nested group styling
1:26 - Peer styling
2:05 - Ring
3:12 - Custom & community plugins

Пікірлер: 26

@r-ddle 2 ай бұрын

I'm new to tailwind and I love these type of videos ❤ thank you so much

@0xAndy 2 ай бұрын

My favorite Tailwind plugin is container queries. After getting used to them, you'll realize that media queries are less often what you actually want. At a component level, container queries really flourish.

@tomisloading 2 ай бұрын

Absolutely! I really need to use them more. I’ve played with them, but haven’t really worked them well into my day to day. Probably worth getting used to them and making a video on it haha

@ryzzlas 2 ай бұрын

Yes, but Safari only supports it from v16. Just keep that in mind...

@julienblanchon6082 2 ай бұрын

Peer combine with the success and failed modifier is awesome

@Fadhilx 2 ай бұрын

im disappointed with yt algorithm for not recommend your channel to me sooner.

@davidlintin 2 ай бұрын

Same.

@themarksmith 2 ай бұрын

Keep them coming sir, some useful stuff here!

@tomisloading 2 ай бұрын

Thank you, and will do!! :)

@bozzhik 2 ай бұрын

bro. your channel is awesome. i need video about tailwind plugins, im waiting baby

@tomisloading 2 ай бұрын

Added to the list! :)

@Muphet 2 ай бұрын

lmao they finally implemented size. i used plugin to set width and height to same thing for years

@abdushakoor0099 2 ай бұрын

tailwind group is awesome

@lukas.webdev 2 ай бұрын

Yes, 100%! 🔥

@loground 2 ай бұрын

legend

@houseofdragons9764 2 ай бұрын

Arigato 🔥

@PixeLabor 2 ай бұрын

nice tips. thanks!

@tomisloading 2 ай бұрын

Happy to help!! 🫡😁

@tamerahmed9860 2 ай бұрын

Thank you 🙏

@tomisloading 2 ай бұрын

Of course! 😁

@labdo_ 2 ай бұрын

Size-* is new, it was added in v3.4

@user-vd3ph6zh8q Ай бұрын

I have package on npm that lets you define primitives and themes for tailwind and creates a plugin for you

@MrMaxiePL 2 ай бұрын

npm remove

@ronitgurjar5747 2 ай бұрын

we appreciate the recent uploads🔥🔥great content🫡✨✨✨

@tomisloading 2 ай бұрын

Thank you! :)