Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

Tailwind Tweak #6 Learn how to do custom form validation with Tailwind CSS, no JavaScript required. 🪄 Code: Don't forget to follow for daily tweaks!🫶🏻

Namya @ Supafast

54,907 subscribers

57,317 views • 3 years ago •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

Skewed infinite carousel w/ vignette effect ✨ Built entirely with Tailwind CSS – zero JavaScript required. Live demo & code 👇

Skewed infinite carousel w/ vignette effect ✨ Built entirely with Tailwind CSS – zero JavaScript required. Live demo & code 👇

Steven Tey

472,799 views • 2 years ago

Tailwind CSS Tip ✨ You can create some cool looking loaders and spinners using Tailwind CSS. Thanks to Tailscan for Tailwind CSS for the inspiration. Demo & Code 👇 (14/30) follow for 16 more tips 🔔

Tailwind CSS Tip ✨ You can create some cool looking loaders and spinners using Tailwind CSS. Thanks to Tailscan for Tailwind CSS for the inspiration. Demo & Code 👇 (14/30) follow for 16 more tips 🔔

Surjith S M ✪

140,240 views • 3 years ago

Tailwind CSS Tip ✨ You can create a floating input form with Tailwind CSS using ":placeholder-shown" pseudo class. Live Demo & Code 👇 (8/30) follow for 22 more tips 🔔

Tailwind CSS Tip ✨ You can create a floating input form with Tailwind CSS using ":placeholder-shown" pseudo class. Live Demo & Code 👇 (8/30) follow for 22 more tips 🔔

Surjith S M ✪

173,086 views • 3 years ago

Added a glow feature to my shadcn cards with tailwind v4, no component duplication, just blendmode and css shananigans ✨

Added a glow feature to my shadcn cards with tailwind v4, no component duplication, just blendmode and css shananigans ✨

Dev Ed

61,377 views • 1 year ago

I’m loving the new sidebar interaction by Adam Stern for Dia — had to try recreating it myself with Tailwind CSS and Motion😄

I’m loving the new sidebar interaction by Adam Stern for Dia — had to try recreating it myself with Tailwind CSS and Motion😄

Raul

14,689 views • 1 year ago

Put together this little demo for the introduction module in this new "Tailwind CSS by Example" course I'm working on. Succinctly covers all of the fundamental elements of building things with Tailwind in one example 👍 Excited to get back in the studio and hit record 🎬

Put together this little demo for the introduction module in this new "Tailwind CSS by Example" course I'm working on. Succinctly covers all of the fundamental elements of building things with Tailwind in one example 👍 Excited to get back in the studio and hit record 🎬

Adam Wathan

28,667 views • 11 months ago

Despite the Framer hype, we still get tons of requests for custom Next.js + Tailwind sites. Because most founders and their teams don't want to learn another tool. They want to own their code, not rent it. Just shipped a landing page in Next.js for a SaaS. Their reasoning: - Full control over performance optimization - No vendor lock-in - Developers can maintain it without learning Framer - Custom functionality without workarounds - Better SEO control Sure, Framer is faster to build. But he no-code movement sold everyone on "anyone can build websites now" and forgot that someone still needs to maintain them. What's your take: Custom code for control or no-code for speed?

Despite the Framer hype, we still get tons of requests for custom Next.js + Tailwind sites. Because most founders and their teams don't want to learn another tool. They want to own their code, not rent it. Just shipped a landing page in Next.js for a SaaS. Their reasoning: - Full control over performance optimization - No vendor lock-in - Developers can maintain it without learning Framer - Custom functionality without workarounds - Better SEO control Sure, Framer is faster to build. But he no-code movement sold everyone on "anyone can build websites now" and forgot that someone still needs to maintain them. What's your take: Custom code for control or no-code for speed?

Namya @ Supafast

50,594 views • 10 months ago

How to create a Simple Sushi 🍣 Restaurant Landing Page. I’ll provide you with the HTML, CSS, and JavaScript code snippets to build it step by step.

How to create a Simple Sushi 🍣 Restaurant Landing Page. I’ll provide you with the HTML, CSS, and JavaScript code snippets to build it step by step.

Dhanian 🗯️

46,880 views • 1 year ago

its out! +50 Tailwind CSS buttons ready for use: free, no js, easy to integrate with a simple copy-paste This will be my evolving collection, I will add new styles and micro-interactions soon. Feel free to star the GitHub repo for updates

its out! +50 Tailwind CSS buttons ready for use: free, no js, easy to integrate with a simple copy-paste This will be my evolving collection, I will add new styles and micro-interactions soon. Feel free to star the GitHub repo for updates

Ibelick

131,343 views • 2 years ago

Developers are making $60K+/y but they paid 500$ for courses. This guide help you to Learn for FREE - CSS - HTML - JavaScript To get it, 1. Like 2. Reply ‘👋🏼’ 3. Follow me (so I can DM)

Developers are making $60K+/y but they paid 500$ for courses. This guide help you to Learn for FREE - CSS - HTML - JavaScript To get it, 1. Like 2. Reply ‘👋🏼’ 3. Follow me (so I can DM)

Atakan 💻

67,668 views • 3 years ago

I have clients who need Webflow, Framer, Next.js/Tailwind CSS services. Last month, I teamed up with Irfan Aziz on a Framer project. I'm looking to collaborate with devs: • Full pay, no cut • No referral fees • Must be a goat at development Share your best website development project links below!

I have clients who need Webflow, Framer, Next.js/Tailwind CSS services. Last month, I teamed up with Irfan Aziz on a Framer project. I'm looking to collaborate with devs: • Full pay, no cut • No referral fees • Must be a goat at development Share your best website development project links below!

Namya @ Supafast

91,415 views • 2 years ago

finally got around to updating my site to Next.js 15 + Tailwind CSS v4. finally added a dark mode which was quite nice with oklch() + v4 theme vars. i made it greenish to complement my warm light mode. also used View Transition API + svg filter for this theme reveal effect.

finally got around to updating my site to Next.js 15 + Tailwind CSS v4. finally added a dark mode which was quite nice with oklch() + v4 theme vars. i made it greenish to complement my warm light mode. also used View Transition API + svg filter for this theme reveal effect.

Stammy

72,402 views • 1 year ago

pov: you have ZERO experience with Shopify and starting a clothing brand, but u know how to code... I used Shopify's custom code editor w/ Cursor to create this drop page for my NEW clothing brand - only HTML + CSS launching my clothing brand soon lfggg 👀

Rexan Wong

11,744 views • 1 year ago

Brought back the ability to copy colors from the Tailwind docs — regular click will copy the OKLCH value, shift+click will copy the nearest hex value 👍🏻 Useful for Figma and stuff, or to just steal our colors and use them with some other CSS framework you hate less.

Brought back the ability to copy colors from the Tailwind docs — regular click will copy the OKLCH value, shift+click will copy the nearest hex value 👍🏻 Useful for Figma and stuff, or to just steal our colors and use them with some other CSS framework you hate less.

Adam Wathan

44,351 views • 1 year ago

🔥 {webR} is the next R revolution. Instead of a static quarto report, you can now edit code chunks to tweak the analysis!! 😳 - how to: - result: Next goal: dropdown button that triggers a change. Don't know how to do yet 😔

🔥 {webR} is the next R revolution. Instead of a static quarto report, you can now edit code chunks to tweak the analysis!! 😳 - how to: - result: Next goal: dropdown button that triggers a change. Don't know how to do yet 😔

Yan Holtz

16,367 views • 1 year ago

Our new Google AI Professional Certificate from #GrowWithGoogle features 20+ hands-on labs designed to help you use AI as a partner in your daily work. You’ll learn how to: ✔️ Build project plans and daily workflows ✔️ Vibe code custom AI applications for your job ✔️ Generate custom marketing and creative assets ✔️ Develop data-backed market research

Our new Google AI Professional Certificate from #GrowWithGoogle features 20+ hands-on labs designed to help you use AI as a partner in your daily work. You’ll learn how to: ✔️ Build project plans and daily workflows ✔️ Vibe code custom AI applications for your job ✔️ Generate custom marketing and creative assets ✔️ Develop data-backed market research

Google

637,565 views • 5 months ago

Our team has been really busy working on this, and I'm thrilled that we're soon going to have an awesome JavaScript solution for our "plain HTML" (non-React/Vue) components in Tailwind Plus! 🌮 We even have all our command palette examples working with it — even tricky ones like this one! 🔥

Our team has been really busy working on this, and I'm thrilled that we're soon going to have an awesome JavaScript solution for our "plain HTML" (non-React/Vue) components in Tailwind Plus! 🌮 We even have all our command palette examples working with it — even tricky ones like this one! 🔥

Jonathan Reinink

28,002 views • 1 year ago

you can create a CSS only carousel with CSS `𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙` .𝚜𝚌𝚛𝚘𝚕𝚕𝚎𝚛 { 𝚘𝚟𝚎𝚛𝚏𝚕𝚘𝚠-𝚡: 𝚊𝚞𝚝𝚘; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚝𝚢𝚙𝚎: 𝚡 𝚖𝚊𝚗𝚍𝚊𝚝𝚘𝚛𝚢; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚊𝚍𝚍𝚒𝚗𝚐-𝚒𝚗𝚕𝚒𝚗𝚎: 𝟷.𝟻𝚛𝚎𝚖; /* 𝚖𝚊𝚝𝚌𝚑𝚎𝚜 𝚢𝚘𝚞𝚛 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚕/𝚙𝚛 */ } .𝚌𝚊𝚛𝚍 { 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚊𝚕𝚒𝚐𝚗: 𝚌𝚎𝚗𝚝𝚎𝚛; 𝚏𝚕𝚎𝚡-𝚜𝚑𝚛𝚒𝚗𝚔: 𝟶; } When you scroll, it snaps exactly in the center of the card Super fun to use, easy to implement, no javascript required

you can create a CSS only carousel with CSS `𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙` .𝚜𝚌𝚛𝚘𝚕𝚕𝚎𝚛 { 𝚘𝚟𝚎𝚛𝚏𝚕𝚘𝚠-𝚡: 𝚊𝚞𝚝𝚘; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚝𝚢𝚙𝚎: 𝚡 𝚖𝚊𝚗𝚍𝚊𝚝𝚘𝚛𝚢; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚊𝚍𝚍𝚒𝚗𝚐-𝚒𝚗𝚕𝚒𝚗𝚎: 𝟷.𝟻𝚛𝚎𝚖; /* 𝚖𝚊𝚝𝚌𝚑𝚎𝚜 𝚢𝚘𝚞𝚛 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚕/𝚙𝚛 */ } .𝚌𝚊𝚛𝚍 { 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚊𝚕𝚒𝚐𝚗: 𝚌𝚎𝚗𝚝𝚎𝚛; 𝚏𝚕𝚎𝚡-𝚜𝚑𝚛𝚒𝚗𝚔: 𝟶; } When you scroll, it snaps exactly in the center of the card Super fun to use, easy to implement, no javascript required

Manu Arora

56,137 views • 3 months ago

Introducing ApeChain Vibe Code Camp, a new educational experience in collaboration with Venture Miner. Learn to go from idea to interactive prototype ON APECHAIN. No experience required. Sign up below ⬇️

Introducing ApeChain Vibe Code Camp, a new educational experience in collaboration with Venture Miner. Learn to go from idea to interactive prototype ON APECHAIN. No experience required. Sign up below ⬇️

ApeChainHUB

46,707 views • 11 months ago