2020-06-05
1252
#css
Nada Rifki
19827
Jun 5, 2020 â‹… 4 min read

10 Tailwind CSS tips to boost your productivity

Nada Rifki Nada is a JavaScript developer who likes to play with UI components to create interfaces with great UX. She specializes in Vue.js and loves sharing anything and everything that could help her fellow frontend web developers. Nada also dabbles in digital marketing, dance, and Chinese.

Recent posts:

float ui tutorial

Building responsive websites fast: A Float UI tutorial

Discover Float UI, a set of pre-made templates that leverage the power of Tailwind CSS to help developers create professional websites quickly.

Murat YĂĽksel
Apr 21, 2025 â‹… 22 min read
react toastify

React-Toastify (2025 update): Setup, styling & real-world use cases

Learn how to use React-Toastify in 2025, from setup to styling and advanced use cases like API notifications, async toasts, and React-Toastify 11 updates.

Chimezie Innocent
Apr 18, 2025 â‹… 18 min read
5 Best Open Source Tools For Cross-Browser CSS Testing

5 best open source tools for cross-browser CSS testing

Discover open source tools for cross-browser CSS testing like Playwright and BrowserStack to catch rendering errors, inconsistent styling, and more.

Peter Aideloje
Apr 18, 2025 â‹… 11 min read
react suspense data fetching

How to handle data fetching with React Suspense

With the introduction of React Suspense, handling asynchronous operations like data fetching has become more efficient and declarative.

Ovie Okeh
Apr 18, 2025 â‹… 10 min read
View all posts

3 Replies to "10 Tailwind CSS tips to boost your productivity"

  1. Hi i’ve add new breakpoint like this

    module.exports = {
    theme: {
    screens: {
    xs: “375px”,
    m: “425px”,

    sm: “640px”,
    // => @media (min-width: 640px) { … }
    md: “768px”,
    // => @media (min-width: 768px) { … }
    lg: “1024px”,
    // => @media (min-width: 1024px) { … }
    xl: “1280px”,
    // => @media (min-width: 1280px) { … }
    },
    },
    };

    but when i test

    DIdntWorK

  2. In my case I wanted to extract everything into components but have overwritable styles for said components. You can use @apply inside of a vue components scoped style to do that. Best of both worlds.

Leave a Reply