Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

The open-source library of CSS motion effects, Kinetics, now contains 99 motion effects. You can copy CSS to the clipboard or the prompt so it's easy to replicate in your AI tool.

csaba_kissi's profile picture

Csaba Kissi

255,462 subscribers

70,909 görüntüleme • 1 gün önce •via X (Twitter)

Bilim & TeknolojiEğitim
LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

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

Benzer Videolar

Open source library of motion effects - Kinetics now has 99 animations. - CSS + React version - Prompt version for your AI coding agent
0:27

Open source library of motion effects - Kinetics now has 99 animations. - CSS + React version - Prompt version for your AI coding agent

Csaba Kissi

28,094 görüntüleme • 10 gün önce

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 görüntüleme • 8 gün önce

Must-know open-source tools for coders and developers - Open source CSS/React motion snippets with prompts - Largest UI Animation & Micro Interaction Library coverflow.ashishgogula.in- iOS-like Cover Flow for React. - Docker compose samples - Gradient buttons with hover effects
0:36

Must-know open-source tools for coders and developers - Open source CSS/React motion snippets with prompts - Largest UI Animation & Micro Interaction Library coverflow.ashishgogula.in- iOS-like Cover Flow for React. - Docker compose samples - Gradient buttons with hover effects

Csaba Kissi

32,414 görüntüleme • 17 gün önce

Introducing the open-source Next.js Audio Starter Kit Add Text to Speech, Speech to Text, Sound Effects and Conversational AI to your product in minutes. Built with: • ElevenLabs SDK • Next.js + shadcn/ui • Tailwind CSS v4 Repo link in the comments below:
1:01

Introducing the open-source Next.js Audio Starter Kit Add Text to Speech, Speech to Text, Sound Effects and Conversational AI to your product in minutes. Built with: • ElevenLabs SDK • Next.js + shadcn/ui • Tailwind CSS v4 Repo link in the comments below:

ElevenLabs Developers

145,836 görüntüleme • 1 yıl önce

Open-source and free apps for coders and makers - CSS Text effects with AI prompts - Open-source self-hosted dashboard for Amazon SES - Free directory of public APIs - Open-source security framework - UI library for building terminal user interfaces
0:35

Open-source and free apps for coders and makers - CSS Text effects with AI prompts - Open-source self-hosted dashboard for Amazon SES - Free directory of public APIs - Open-source security framework - UI library for building terminal user interfaces

Csaba Kissi

25,136 görüntüleme • 4 gün önce

You can make so many interesting patterns and effects using the 'replicate' effect in unicorn.studio. It's been my go-to lately.
0:21

You can make so many interesting patterns and effects using the 'replicate' effect in unicorn.studio. It's been my go-to lately.

Yianni

23,002 görüntüleme • 8 ay önce

We just launched AI Motion Graphics with Anthropic Think vibecoding for motion design. The cost of professional motion work just dropped to zero. All generated from a single prompt. Small teams can now produce the same quality as large agencies. No After Effects, no templates, no code — just describe what you want. Try it on
0:36

We just launched AI Motion Graphics with Anthropic Think vibecoding for motion design. The cost of professional motion work just dropped to zero. All generated from a single prompt. Small teams can now produce the same quality as large agencies. No After Effects, no templates, no code — just describe what you want. Try it on

Invideo

464,319 görüntüleme • 5 ay önce

New in Chrome DevTools: Gemini can modify and save CSS changes directly to your source! Tired of manually copying CSS changes from DevTools back to your editor? Gemini to the rescue! You can now ask Gemini in the AI Assistance panel to: ✨ Modify and fix CSS within the Elements panel. 🧪 Instantly test changes live. 💾 Save those changes back to your source files on your computer with a connected workspace folder. This is a game-changer for rapid iteration.
0:33

New in Chrome DevTools: Gemini can modify and save CSS changes directly to your source! Tired of manually copying CSS changes from DevTools back to your editor? Gemini to the rescue! You can now ask Gemini in the AI Assistance panel to: ✨ Modify and fix CSS within the Elements panel. 🧪 Instantly test changes live. 💾 Save those changes back to your source files on your computer with a connected workspace folder. This is a game-changer for rapid iteration.

Addy Osmani

36,911 görüntüleme • 1 yıl önce

figured out how to do motion blurs in the browser using svg filters and css
0:35

figured out how to do motion blurs in the browser using svg filters and css

ravarcheon

24,707 görüntüleme • 7 ay önce

THE FIRST EVER AI motion design tool with full real-time control. Higgsfield Vibe-Motion is LIVE. Motion Design was never that easy. One prompt creates any motion design you can imagine. Refine every parameter live on canvas. No creative limits.
0:37

THE FIRST EVER AI motion design tool with full real-time control. Higgsfield Vibe-Motion is LIVE. Motion Design was never that easy. One prompt creates any motion design you can imagine. Refine every parameter live on canvas. No creative limits.

Higgsfield AI 🧩

3,133,618 görüntüleme • 5 ay önce

Must-know open-source tools for coders - terminal UIs in React - copy/paste CSS/React transitions - React funnel charts - Javascript/React animation library - open-source headless cms
0:28

Must-know open-source tools for coders - terminal UIs in React - copy/paste CSS/React transitions - React funnel charts - Javascript/React animation library - open-source headless cms

Csaba Kissi

85,731 görüntüleme • 24 gün önce

I did it! 100 Unique CSS Patterns 🤩 👉 👈 One of the biggest collection of CSS patterns ever! ✅ One-click to copy/paste ✅ One value to control the size ✅ Optimized with CSS variables Which one is your favorite? Tell me in the comments 👇 #CSS
0:23

I did it! 100 Unique CSS Patterns 🤩 👉 👈 One of the biggest collection of CSS patterns ever! ✅ One-click to copy/paste ✅ One value to control the size ✅ Optimized with CSS variables Which one is your favorite? Tell me in the comments 👇 #CSS

CSS by T. Afif

29,169 görüntüleme • 3 yıl önce

Next-level motion from @HeyGen_Official I got to play with the new AI Motion from HeyGen, and it blew my mind! You generate an image and describe the motion; then, you can generate long videos from that avatar. Sound effects included! 1. Tales from The Heartland
1:11

Next-level motion from @HeyGen_Official I got to play with the new AI Motion from HeyGen, and it blew my mind! You generate an image and describe the motion; then, you can generate long videos from that avatar. Sound effects included! 1. Tales from The Heartland

Alex Patrascu

57,728 görüntüleme • 1 yıl önce

introducing Seedance Effects. our new library lets you apply motion and style effects to any video with just a click. link and examples below 👇
0:20

introducing Seedance Effects. our new library lets you apply motion and style effects to any video with just a click. link and examples below 👇

Krea

39,159 görüntüleme • 2 ay önce

Learn this smooth and easy motion graphics in after effects
0:59

Learn this smooth and easy motion graphics in after effects

After Effects Tricks!

23,665 görüntüleme • 7 ay önce

Learn how to create a mesmerizing holographic effect in After Effects and take your motion graphics to the next level!
1:30

Learn how to create a mesmerizing holographic effect in After Effects and take your motion graphics to the next level!

Premiere Pro Tricks!

17,550 görüntüleme • 11 ay önce

🚀 Motion has landed in Modvfi! With Motion Effects, you can quickly transform your designs into scroll-stopping loops, and create insane motion effects in seconds. We're live on Product Hunt 😸, come by and let us know what you think!
0:41

🚀 Motion has landed in Modvfi! With Motion Effects, you can quickly transform your designs into scroll-stopping loops, and create insane motion effects in seconds. We're live on Product Hunt 😸, come by and let us know what you think!

Modyfi

53,210 görüntüleme • 2 yıl önce

CSS shape() landed in Firefox 148. It's similar to path(), but allows the full expressiveness of CSS…
1:56

CSS shape() landed in Firefox 148. It's similar to path(), but allows the full expressiveness of CSS…

Firefox for Web Developers

11,375 görüntüleme • 4 ay önce

when the tool is missing, make it 👨‍🍳 motion path visualizer w/ SVG for accumulated cubic-bezier timed CSS animations ⚡
0:24

when the tool is missing, make it 👨‍🍳 motion path visualizer w/ SVG for accumulated cubic-bezier timed CSS animations ⚡

jhey ʕ•ᴥ•ʔ

213,366 görüntüleme • 8 ay önce

Introducing Prism UI ✨ A UI library built on top of shadcn components to create beautiful pages 🪄 Animated components that are build on shadcn, Tailwind CSS and framer motion. 100% Free and Open Source I have drawn inspiration from two main sources ◆ shadcn - The foundation and the 🐐 ◆ Steven Tey - The clean, modern UI/UX seen in dub has been a huge inspiration Tech Stack: Vercel shadcn Framer Tailwind CSS v0 Matt Perry (framer motion) This was my holiday project - Hope you like it 🖤 #opensource #buildinpublic
0:47

Introducing Prism UI ✨ A UI library built on top of shadcn components to create beautiful pages 🪄 Animated components that are build on shadcn, Tailwind CSS and framer motion. 100% Free and Open Source I have drawn inspiration from two main sources ◆ shadcn - The foundation and the 🐐 ◆ Steven Tey - The clean, modern UI/UX seen in dub has been a huge inspiration Tech Stack: Vercel shadcn Framer Tailwind CSS v0 Matt Perry (framer motion) This was my holiday project - Hope you like it 🖤 #opensource #buildinpublic

CodeHagen

241,425 görüntüleme • 1 yıl önce