Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

I’m creating a playground of CSS easing functions 🌟 Each animation will include an SVG preview, along with a ready-to-copy Tailwind CSS class. Launching next week 🔥

pacovitiello's profile picture

Pasquale Vitiello

10,828 subscribers

35,479 görüntüleme • 1 yıl önce •via X (Twitter)

SanatEğitimBilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

My SVG icons won't be boring anymore 🤯 → Microanimations → Ready-to-copy components → CSS and Tailwind supported So simple, so impressive 🔥 #buildinpublic
0:15

My SVG icons won't be boring anymore 🤯 → Microanimations → Ready-to-copy components → CSS and Tailwind supported So simple, so impressive 🔥 #buildinpublic

Bart ⚡

132,998 görüntüleme • 1 yıl önce

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 🔔
0:17

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,050 görüntüleme • 3 yıl önce

5 sites for web developers - React CSS components - Full-stack app hosting (JavaScript, PHP, Python...) - Tailwind CSS library - SVG logos - Typescript UI
0:12

5 sites for web developers - React CSS components - Full-stack app hosting (JavaScript, PHP, Python...) - Tailwind CSS library - SVG logos - Typescript UI

Csaba Kissi

31,129 görüntüleme • 7 ay önce

gooey menu made with svg filters and some little animations, just css and a sprinkle of svg magic
0:18

gooey menu made with svg filters and some little animations, just css and a sprinkle of svg magic

Kevin Grajeda

51,710 görüntüleme • 1 yıl önce

Landing page for an AI-powered health-tech startup. Copy + Design + Development. Stack: Next.js, Tailwind CSS, Shadcn, Vercel.
0:19

Landing page for an AI-powered health-tech startup. Copy + Design + Development. Stack: Next.js, Tailwind CSS, Shadcn, Vercel.

Namya @ Supafast

175,193 görüntüleme • 2 yıl önce

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
0:13

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 görüntüleme • 2 yıl önce

Infinite Marquee Scrolling with Tailwind CSS ✨ ↳
0:11

Infinite Marquee Scrolling with Tailwind CSS ✨ ↳

Surjith S M ✪

103,493 görüntüleme • 3 yıl önce

Looks like Shopify just shipped a redesign! Built with Tailwind CSS 🤩
0:12

Looks like Shopify just shipped a redesign! Built with Tailwind CSS 🤩

Adam Wathan

451,709 görüntüleme • 3 yıl önce

"Learn CSS: Clipping with SVG, shape-outside, shape-margin" by Victor A
0:15

"Learn CSS: Clipping with SVG, shape-outside, shape-margin" by Victor A

CodePen.IO

11,285 görüntüleme • 9 ay önce

Introducing Motion-Primitives: a collection of reusable animated components built with Framer Motion and Tailwind CSS.
0:15

Introducing Motion-Primitives: a collection of reusable animated components built with Framer Motion and Tailwind CSS.

Ibelick

88,818 görüntüleme • 1 yıl önce

toggle 🌛 brought to life with CSS && SVG
0:19

toggle 🌛 brought to life with CSS && SVG

jhey ʕ•ᴥ•ʔ

84,189 görüntüleme • 1 yıl önce

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 🔔
0:11

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,209 görüntüleme • 3 yıl önce

Just added a Tailwind CSS UI block directly to my Lovable app by installing 2 npm packages, creating a blank component called hero.tsx, and then just pasting in the Tailwind code. Pixel perfect responsive design that cost me pretty much nothing and took me 1 minute to do. Next I'll adapt the copy and update with my brand colors. I'm going to be teaching this method to the Buildcamp bootcamp cohort next week! Link in comments
0:18

Just added a Tailwind CSS UI block directly to my Lovable app by installing 2 npm packages, creating a blank component called hero.tsx, and then just pasting in the Tailwind code. Pixel perfect responsive design that cost me pretty much nothing and took me 1 minute to do. Next I'll adapt the copy and update with my brand colors. I'm going to be teaching this method to the Buildcamp bootcamp cohort next week! Link in comments

Gregory John

18,045 görüntüleme • 1 yıl önce

an alternative approach to console animation that doesn't hijack the console 1. inline CSS animation into an SVG 2. style console message with background-image 3. use SVG as the background-image 🚀 console​.info( "%ccome cook", "background-image: url(/animated.svg);" )
0:10

an alternative approach to console animation that doesn't hijack the console 1. inline CSS animation into an SVG 2. style console message with background-image 3. use SVG as the background-image 🚀 console​.info( "%ccome cook", "background-image: url(/animated.svg);" )

jhey ʕ•ᴥ•ʔ

93,342 görüntüleme • 1 yıl önce

Stripe's Black Friday dashboard is built with Tailwind CSS 🥳
0:12

Stripe's Black Friday dashboard is built with Tailwind CSS 🥳

Adam Wathan

97,661 görüntüleme • 2 yıl önce

¡Si eres programador necesitas esta herramienta! Transforma código entre diferentes formatos. ✓ SVG a componente de React ✓ JSON a interfaz de TypeScript ✓ CSS a clases de Tailwind ✓ ...y muchas más! → transform․tools
0:14

¡Si eres programador necesitas esta herramienta! Transforma código entre diferentes formatos. ✓ SVG a componente de React ✓ JSON a interfaz de TypeScript ✓ CSS a clases de Tailwind ✓ ...y muchas más! → transform․tools

Miguel Ángel Durán

94,344 görüntüleme • 2 yıl önce

backdrop-filter + svg-filter #css
0:16

backdrop-filter + svg-filter #css

Kitasenju Design

24,006 görüntüleme • 2 yıl önce

if you need some free and open source tailwind css blocks, you can use You'll find free Tailwind CSS & shadcn blocks Enjoy.
0:10

if you need some free and open source tailwind css blocks, you can use You'll find free Tailwind CSS & shadcn blocks Enjoy.

Duncan

53,999 görüntüleme • 6 ay önce

That SVG filter is the whole reason this CSS scroll animation is even possible 🙏 (now with improved timing ✨)
0:16

That SVG filter is the whole reason this CSS scroll animation is even possible 🙏 (now with improved timing ✨)

jhey ʕ•ᴥ•ʔ

94,008 görüntüleme • 1 yıl önce