正在加载视频...

视频加载失败

返回首页

Excited to announce Easing Wizard is now live! 🎉 The ultimate CSS easing editor with support for Bézier, spring, bounce, wiggle, and overshoot! 🚀 🔗 Some key features are: ⚡ Uses linear timing function instead of keyframes 🎢 Multiple curve types ⏸️ Pause between animation previews 🎥 10 preview...

RoyDigerhund's profile picture

Matthias Martin

1,151 subscribers

13,307 次观看 • 1 年前 •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

your signature is a custom easing function™ ✒️ draw it map the motion to css linear() timing function package as portable SVG paste anywhere 👇
0:28

your signature is a custom easing function™ ✒️ draw it map the motion to css linear() timing function package as portable SVG paste anywhere 👇

jhey ʕ•ᴥ•ʔ

169,634 次观看 • 1 个月前

Anime.js 4.2.0 is out! 🧩 All modules can now be imported individually with subpaths 🎨 CSS variable values support 🏹 Simpler spring API with bounce & duration params 📈 More WAAPI built-in easing functions 🎛️ And an easing editor! Plus tons of fixes and improvements!
0:38

Anime.js 4.2.0 is out! 🧩 All modules can now be imported individually with subpaths 🎨 CSS variable values support 🏹 Simpler spring API with bounce & duration params 📈 More WAAPI built-in easing functions 🎛️ And an easing editor! Plus tons of fixes and improvements!

Julian Garnier

292,840 次观看 • 9 个月前

adding the little details™ progressively enhance the overdrag bounce with a sprinkle of JavaScript and some CSS linear() ✨
0:20

adding the little details™ progressively enhance the overdrag bounce with a sprinkle of JavaScript and some CSS linear() ✨

jhey ʕ•ᴥ•ʔ

90,167 次观看 • 2 年前

#CSS linear() easing can be soft, subtle and minimal OR firm, tense and loud here's how I'm using it in a few areas of my site ❤️ so fun.
0:23

#CSS linear() easing can be soft, subtle and minimal OR firm, tense and loud here's how I'm using it in a few areas of my site ❤️ so fun.

Adam Argyle

16,164 次观看 • 1 年前

dropdown™ :root { --bounce: linear( 0, 0.0625, 0.25 18.18%, 1 36.36%, 0.8125, 0.75, 0.8125, 1, 0.9375, 1, 1 ); } [popover] { animation-timing-function: var(--bounce); } CSS 😎
0:28

dropdown™ :root { --bounce: linear( 0, 0.0625, 0.25 18.18%, 1 36.36%, 0.8125, 0.75, 0.8125, 1, 0.9375, 1, 1 ); } [popover] { animation-timing-function: var(--bounce); } CSS 😎

jhey ʕ•ᴥ•ʔ

59,470 次观看 • 2 年前

I forgot to mention that every easing can also be used in pure CSS, no JS required, including the spring curves!
0:25

I forgot to mention that every easing can also be used in pure CSS, no JS required, including the spring curves!

Julian Garnier

44,253 次观看 • 9 个月前

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖
2:08

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖

Shefali

22,953 次观看 • 1 年前

Here is the collection of 60 open-source animated CSS tooltips. Both the CSS version and the prompt for AI tools are available.
0:22

Here is the collection of 60 open-source animated CSS tooltips. Both the CSS version and the prompt for AI tools are available.

Csaba Kissi

13,195 次观看 • 8 天前

easing is everything use different CSS timing functions per axis for custom motion paths 👨‍🍳 .p { animation: x .8s var(--x-time), y .8s var(--y-time); animation-composition: accumulate; } @​keyframes x { to { translate: var(--x) 0 } @​keyframes y { to { translate: 0 var(--y) }
0:40

easing is everything use different CSS timing functions per axis for custom motion paths 👨‍🍳 .p { animation: x .8s var(--x-time), y .8s var(--y-time); animation-composition: accumulate; } @​keyframes x { to { translate: var(--x) 0 } @​keyframes y { to { translate: 0 var(--y) }

jhey ʕ•ᴥ•ʔ

271,331 次观看 • 8 个月前

This week, Gabriel Perales 🤓 and I worked together on a tool for Tailwind CSS users. The tool lets you easily create grids for your Tailwind CSS projects, perfect for generating bento-style grids! It supports Tailwind CSS v3/v4 —
1:08

This week, Gabriel Perales 🤓 and I worked together on a tool for Tailwind CSS users. The tool lets you easily create grids for your Tailwind CSS projects, perfect for generating bento-style grids! It supports Tailwind CSS v3/v4 —

Michael Andreuzza

69,293 次观看 • 1 年前

🤌 Blurry blobs with Tailwind CSS 1️⃣ create a few colorful shapes 2️⃣ add some blur and mix-blend-modes 3️⃣ keyframe the position & size of the shapes 4️⃣ stagger the animation-delay for randomness
0:53

🤌 Blurry blobs with Tailwind CSS 1️⃣ create a few colorful shapes 2️⃣ add some blur and mix-blend-modes 3️⃣ keyframe the position & size of the shapes 4️⃣ stagger the animation-delay for randomness

Simon Vrachliotis

23,445 次观看 • 1 年前

it's all about easing curves ⏱️ translation powered via CSS custom properties
0:20

it's all about easing curves ⏱️ translation powered via CSS custom properties

jhey ʕ•ᴥ•ʔ

64,278 次观看 • 1 年前

Pretty fun seeing how you can combine different CSS tricks with scroll 😁 The basic combination of overflow: hidden and steps() animation timing makes this happen ⭐️
0:23

Pretty fun seeing how you can combine different CSS tricks with scroll 😁 The basic combination of overflow: hidden and steps() animation timing makes this happen ⭐️

jhey ʕ•ᴥ•ʔ

136,417 次观看 • 1 年前

Today is the day! Our most requested feature, design → code generation, is live: Go from idea → design → code in under a minute. You can now export generated UI designs to Tailwind CSS with Galileo. The fastest way to bring your ideas to life. 🚀
0:27

Today is the day! Our most requested feature, design → code generation, is live: Go from idea → design → code in under a minute. You can now export generated UI designs to Tailwind CSS with Galileo. The fastest way to bring your ideas to life. 🚀

Stitch by Google

26,103 次观看 • 2 年前

✨ Build Next.js, Tailwind CSS & shadcn UIs with a visual builder. And yes, you can export the code. Link below.
0:22

✨ Build Next.js, Tailwind CSS & shadcn UIs with a visual builder. And yes, you can export the code. Link below.

Mattia

163,282 次观看 • 1 年前

🌟 Discover the ultimate Tailwind hack! I'm using an amazing Eslint plugin that streamlines your Tailwind CSS code for cleaner, more consistent results. Learn as you code, with intelligent shorthands and organized structure. ▶️ Link: #buildinpublic
0:49

🌟 Discover the ultimate Tailwind hack! I'm using an amazing Eslint plugin that streamlines your Tailwind CSS code for cleaner, more consistent results. Learn as you code, with intelligent shorthands and organized structure. ▶️ Link: #buildinpublic

Kristoffer Eriksson

37,437 次观看 • 2 年前

Quick demo of JS config file support and plugin support in the latest Tailwind CSS v4 alpha 🫣
6:27

Quick demo of JS config file support and plugin support in the latest Tailwind CSS v4 alpha 🫣

Adam Wathan

91,557 次观看 • 1 年前

Motion study for the first half of 2025, Little Plains Want to do more of this — animation, prototyping, motion, AI? Use AE, Jitter, Lottie, Rive, Spline? Live for clean timing, easing? Exploring C4D, Framer Motion, JS/CSS, & AI-driven interfaces? 📩 hello@littleplains.co
0:51

Motion study for the first half of 2025, Little Plains Want to do more of this — animation, prototyping, motion, AI? Use AE, Jitter, Lottie, Rive, Spline? Live for clean timing, easing? Exploring C4D, Framer Motion, JS/CSS, & AI-driven interfaces? 📩 [email protected]

Emmett

25,982 次观看 • 11 个月前

make it pop™ 🎈 CSS linear() is one of my favorite sleeper additions to the platform 💯
0:32

make it pop™ 🎈 CSS linear() is one of my favorite sleeper additions to the platform 💯

jhey ʕ•ᴥ•ʔ

124,142 次观看 • 2 年前

Tailwind Tip #5 ✨ You can use ":invalid" pseudo class to create a pure css Tailwind CSS form validation without javascript. View code 👇 (5/30) follow for 25 more tips 😊
0:24

Tailwind Tip #5 ✨ You can use ":invalid" pseudo class to create a pure css Tailwind CSS form validation without javascript. View code 👇 (5/30) follow for 25 more tips 😊

Surjith S M ✪

169,280 次观看 • 3 年前