Easiest way for Responsive Design in Tailwind with Fluid Tailwind plugin | Tailwind CSS | NextJS
In this video, I'll walk you through the Fluid plugin for Tailwind CSS, which makes creating responsive designs easier than ever. Fluid allows you to scale utilities smoothly between breakpoints using the power of CSS clamp(), giving you flexibility and control with less code.
Whether you're a beginner or a seasoned developer, this plugin will change the way you approach responsive layouts. Join me as we explore how Fluid helps you build better designs that adapt seamlessly to any screen size. 🚀
🔗 Links and Resources:
Fluid Plugin Documentation: https://fluid.tw/
0:00 Intro
0:25 Setup
1:30 How to use Fluid Tailwind
3:40 Limitations
4;55 Customize breakpoints per utility
Contacts:
Email: [email protected]
Portfolio: https://thatanjan.vercel.app/
Blog: https://cules-coding.vercel.app/
Linkedin: / thatanjan
Github: https://github.com/thatanjan/
Twitter: / thatanjan
Blogs you might want to read:
Eslint, prettier setup with TypeScript and react: https://www.culescoding.vercel.app/bl...
What is Client-Side Rendering?: https://www.culescoding.vercel.app/bl...
What is Server Side Rendering?: https://www.culescoding.vercel.app/bl...
Everything you need to know about tree data structure: https://www.culescoding.vercel.app/bl...
13 reasons why you should use Nextjs: https://www.culescoding.vercel.app/bl...
Videos you might want to watch:
Setup Eslint Prettier with Typescript and React -Nextjs, Create React App: • Setup Eslint Prettier with Typescript and ...
Setup and deploy fullstack application on Vercel and Render: • How to setup and deploy fullstack(MERN) ap...
Auth0 basics with Next.JS: • Auth0 basics with Next.JS | Add Google, Gi...
Upload images from React and Node: • How to upload images from React with Node....
Chakra-UI crash course: • Chakra UI crash course | React UI Framework
Next auth crash course: • Next Auth Basics tutorial | Add Google, Gi...
Build a small search engine with MongoDB: • Build a blog using #JAMstack #5 - Build a...
Playlists you might like:
Next.Js tutorials: • Nextjs tutorials
Build a blog using JAMstack: • Build a blog using JAMstack #1 - Intro & S...
Quick tricks: • Access COOKIES in NextJS from server side....
Crash course: • Redux toolkit crash course. Everything you...
How-to videos: • Setup Eslint Prettier with Typescript and ...
Clone Blue Origin Landing Page: • Blue Origin Landing page clone
Stay safe and good bye.