Discover and read the best of Twitter Threads about #TailwindCSS

Most recents (10)

just launched a starter kit ai chat component using Next.js and @LangChainAI

github.com/JohnRSandoval/…
(also thanks @shadcn for the best UI components)
Here's a video of it in action! Comes with an API Key input component that check's if the key is valid, streaming text, & easily customizable with #tailwindcss
Read 4 tweets
Aquí te dejo unos cuantos ejemplos de maquetación #HTML y #CSS con diferentes frameworks o sin ellos con la ayuda del polifacético #ChatGPT …👇
1/ Maquetación de una página "acerca de" genérica con #Bootstrap5 con varios párrafos y una imagen. Image
2/ Maquetación de una Home generalista para una Startup con #tailwindcss. Algunas pequeñas correcciones ¡y voilá! Obviamente, se trata de un comienzo. Sigamos adelante… ImageImageImage
Read 9 tweets
Difference between Bootstrap and Tailwind CSS.

What to choose and when? 👇 Image
Bootstrap and Tailwind CSS are both front-end frameworks, meaning they are collections of CSS classes that can be used to quickly apply styling to web projects.
Bootstrap is a very popular framework, and it's been around for a long time.

It provides a wide range of pre-designed components and styles that you can use to create beautiful, responsive layouts quickly.
Read 20 tweets
¿Quieres practicar haciendo proyectos con #React 💙 y no tienes ni idea de qué hacer? ¡En este HILO 🧵te dejo 5⃣ proyectos 🔝 con React para crecer como #programador! #informatica #frontend #javascript #typescript
Este vídeo de 5⃣h aprox. de @vidamrr es 🔝. 5⃣ proyectos para aprender desde un nivel más básico: lista de tareas, widget de clima 🌥️, selector de emojis... #informatica #frontend #javascript #typescript
Aquí @vidamrr nos trae 5⃣ proyectos de #React 💙 más avanzados: un acortador de URLs, un clon de TikTok, componentes estilo Notion... #informatica #frontend #javascript #typescript
Read 10 tweets
En esta ocasión os traigo un hilo donde os añado diferentes fuentes para poder descargar plantillas HTML totalmente gratis para poder usarlas en vuestros proyectos personales / profesionales.
Abro 🧵🙏
Espero que os guste y lo compartáis con todo el mundo que creáis que le sirva
1.- W3Layouts
w3layouts.com
Más de 4000 plantillas clasificadas en diferentes secciones como páginas personales, de negocios, de ámbito social... Os invito a que echéis un ojo y ya veréis, que merece la pena
2.- Web Flow
webflow.com/free-website-t…
Plantillas para diferentes objetivos. Podremos encontrar plantillas para usarlo en un negocio de fitness, tienda online, blog personal,...
Read 10 tweets
Tailwind CSS vs Inline Styles.

A Visual Comparison outlining a recent #tailwindcss article by @frontstuff_io
1. Inline styles only apply to the elements they’re declared on.
2. Inline styles cannot add pseudo-classes like hover or focus styles
Read 11 tweets
Bootstrap vs Tailwind CSS
What you should know about them
#CodeNewbie #100DaysOfCode #CSS #Bootstrap #tailwindcss Image
Bootstrap, our popularly known among dev community , is a component-based framework that was designed to help Developers to write less CSS and JavaScript code..
Tailwind is just like bootstrap but not component-based, it's packed with utilities classes .and it's very low-level Image
I think almost any tool or projects goes with both...reacts , font-awesome, static Website and the like..I can't voice my opinion on this..but as a beginner like me . bootstrap is good , but not the best practices because it's changed the way I write code..I like Tailwind Image
Read 10 tweets
A huge amount of the anti-#tailwindcss rhetoric seems to focus around 2 points:

1. I'm an expert in CSS and can write it better than a framework.
2. If I'm not writing CSS anymore, then what am I actually doing?

Both of those points are deeply flawed. Here's why (a thread)...
Let's focus on that first point.

"I'm an expert and can write it better than a framework."

You're wrong. Let's just get that out of the way to start.

Writing CSS to achieve a design is only a tiny part of what makes 'good' CSS.

So what is 'good' CSS?
Good CSS:

1. Works with the cascade, not against it.
2. Is lean.
3. Is easily understandable.
4. Is maintainable.
5. Doesn't try to be clever.

Let's break that down into some examples I've seen in my 20 years of writing code, up to me being a Head of Technology.
Read 25 tweets
✨ 8 Things you might not know #TailwindCSS can do with just a few utility classes ✨

Thread 🧵 👇
1️⃣ Adding a gradient color to text with only 5 classes
2️⃣ Set hover state of child elements when the parent is hovered over - using `group` and `group-hover`
Read 12 tweets
Here are 10 reasons to start using @tailwindcss for your next project

#Tailwind #TailwindCSS

🧵Thread 👇
1️⃣ No CSS file needed

As the official website says, you can "Rapidly build modern websites without ever leaving your HTML"

It's like writing inline styles for each html element, but using class names - Far more readable and much faster to type. You almost don't need a CSS file.
2️⃣ No need for class names

Every time you need to style an element, you must think of a suitable class name. And then class names for the child elements.

To modify styles, you need to refer to the class name, go to CSS and then make changes. All that is avoided using Tailwind!
Read 13 tweets

Related hashtags

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3.00/month or $30.00/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!