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.

Built a new component library: animated image generation loader and reveal effect 3 different types, dark and light mode support npm install img-fx

Jakub Antalik

10,808 subscribers

16,228 views • 1 month 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

Created a new variant of the Border beam UI effect: Pulse. Inner and outside types, multiple color variants, dark and light mode npm install border-beam

Created a new variant of the Border beam UI effect: Pulse. Inner and outside types, multiple color variants, dark and light mode npm install border-beam

Jakub Antalik

37,447 views • 14 days ago

Animated transitions when switching between light and dark themes. Install with shadcn CLI npx shadcn add @ncdai/theme-toggle-effect-circle

Animated transitions when switching between light and dark themes. Install with shadcn CLI npx shadcn add @ncdai/theme-toggle-effect-circle

Chánh Đại

11,928 views • 2 months ago

Here's how I used Unicorn Studio and Framer to build out an image reveal component, inspired by the new Lando Norris site created by OFF+BRAND. (amazing work). Just a different take and experimenting with the tools. Img: Midjourney

Yianni

77,960 views • 8 months ago

Galeria 1 is now available – an image viewer for React (+ Native) → New Architecture Support → Stable web support → Bring-your-own-image component Automatic support for: solito/image, next/image, expo-image, react-native-fast-image, web <img />

Galeria 1 is now available – an image viewer for React (+ Native) → New Architecture Support → Stable web support → Bring-your-own-image component Automatic support for: solito/image, next/image, expo-image, react-native-fast-image, web <img />

Fernando Rojo

27,366 views • 1 year ago

Data is easier to understand when it's visual. Today, we've dropped a new chart component. - JSON support - light/dark mode - dynamically rendered Everything you need to know 👇

Data is easier to understand when it's visual. Today, we've dropped a new chart component. - JSON support - light/dark mode - dynamically rendered Everything you need to know 👇

Resend

94,476 views • 1 month ago

Auth UI: a pre-built React component for authenticating users. Yes, it includes dark mode ⚫️

Auth UI: a pre-built React component for authenticating users. Yes, it includes dark mode ⚫️

Supabase

20,148 views • 3 years ago

Introducing: Light (god) Rays Component for @Framer. Use this component to add this effect to your site in 30 seconds. Customizable intensity, color, and animation. Comment "LIGHT" and I’ll send you the component :)

Introducing: Light (god) Rays Component for @Framer. Use this component to add this effect to your site in 30 seconds. Customizable intensity, color, and animation. Comment "LIGHT" and I’ll send you the component :)

Framer University

46,525 views • 1 year ago

.shadcn is different from most component libraries...because it is NOT a component library.

.shadcn is different from most component libraries...because it is NOT a component library.

Laracasts

17,400 views • 9 months ago

Running AI image generation for thousands of users at once has 3 problems: cost, speed, and crashing servers. So we built a different way with and AkashML. One that brings image gen cost down to just 1 cent/image. Watch and read the full breakdown ⏬ Akash Network

Running AI image generation for thousands of users at once has 3 problems: cost, speed, and crashing servers. So we built a different way with and AkashML. One that brings image gen cost down to just 1 cent/image. Watch and read the full breakdown ⏬ Akash Network

RazerAI

65,849 views • 1 month ago

Introducing the "Preview" component... Try any shader in your project codebase, including Pro presets, in 60 seconds ⚡️ npm install, copy a single component tag, see it live 👀

Introducing the "Preview" component... Try any shader in your project codebase, including Pro presets, in 60 seconds ⚡️ npm install, copy a single component tag, see it live 👀

shaders

15,894 views • 4 months ago

FINALLY!!! Built this Exclusive Fully Responsive Animated Multifunctional Portfolio Website with Light/Dark mode using HTML, CSS & Javascript How's it? Drop your comments 😊 SOURCE CODE 👇

FINALLY!!! Built this Exclusive Fully Responsive Animated Multifunctional Portfolio Website with Light/Dark mode using HTML, CSS & Javascript How's it? Drop your comments 😊 SOURCE CODE 👇

Raja - impeccify.com 🚀

192,258 views • 3 years ago

To get translucent menus right, we had to manually test components over different gradients & colors, checking visuals & accessibility. Now multiply that by 5 component types across 5 styles in both light and dark modes. It's a lot of work. Work that, for now, AI can't do.

To get translucent menus right, we had to manually test components over different gradients & colors, checking visuals & accessibility. Now multiply that by 5 component types across 5 styles in both light and dark modes. It's a lot of work. Work that, for now, AI can't do.

shadcn

92,404 views • 3 months ago

Next.js Dashboard (Financial Edition)! built with - Next.js 16. - Tailwind CSS 4. - Framer Motion. - Next-intl (RTL support) Comes with Dark / Light mode, Charts & analytics, Drag & Drop widgets, JWT auth and multilingual support. Demo + Source Code (First comment) 👇

Next.js Dashboard (Financial Edition)! built with - Next.js 16. - Tailwind CSS 4. - Framer Motion. - Next-intl (RTL support) Comes with Dark / Light mode, Charts & analytics, Drag & Drop widgets, JWT auth and multilingual support. Demo + Source Code (First comment) 👇

Mohamed Djoudir

198,250 views • 5 months ago

7/ After Sun Down, Minimize Evening Light Blue light suppresses melatonin secretion and can disrupt your circadian rhythm. Other types of light can also impact melatonin to varying degrees. + Install dimmer switches and use low, warm lighting + Wear blue light-blocking glasses 2-3 hours before bed + Enable night mode on all devices or install blue light filters + Red light is best (red bulb + lamp ftw) And remember to limit screen time *at least* an hour before bed and blackout your bedroom. Use this time for your 30-60 min wind down routine.

7/ After Sun Down, Minimize Evening Light Blue light suppresses melatonin secretion and can disrupt your circadian rhythm. Other types of light can also impact melatonin to varying degrees. + Install dimmer switches and use low, warm lighting + Wear blue light-blocking glasses 2-3 hours before bed + Enable night mode on all devices or install blue light filters + Red light is best (red bulb + lamp ftw) And remember to limit screen time at least an hour before bed and blackout your bedroom. Use this time for your 30-60 min wind down routine.

Bryan Johnson

151,599 views • 1 year ago

1/4 🚀We are launching Qwen-Image-2.0, a next-generation foundational image generation model. The key highlights of Qwen-Image-2.0 include: Professional Typography Rendering: Supports 1k-token instructions for direct generation of professional infographics, including PPTs, posters, comics, and more. Stronger Semantic Adherence: Native 2K resolution support for finely detailed realistic scenes, including people, nature, and architecture. Improved Text Rendering: Integrated understanding and generation capabilities, unifying image generation and editing in a single mode Lighter Model Architecture: Smaller model size with faster inference speed.

1/4 🚀We are launching Qwen-Image-2.0, a next-generation foundational image generation model. The key highlights of Qwen-Image-2.0 include: Professional Typography Rendering: Supports 1k-token instructions for direct generation of professional infographics, including PPTs, posters, comics, and more. Stronger Semantic Adherence: Native 2K resolution support for finely detailed realistic scenes, including people, nature, and architecture. Improved Text Rendering: Integrated understanding and generation capabilities, unifying image generation and editing in a single mode Lighter Model Architecture: Smaller model size with faster inference speed.

Tongyi Lab

164,097 views • 4 months ago

When a developer switches from dark mode to light mode😭

When a developer switches from dark mode to light mode😭

Aryan

49,997 views • 2 months ago

Integrate Gemini and Imagen APIs into your Flutter applications using the `firebase_ai` package 🪄🔥 In this video, you'll discover different model types for generative content and image generation, constructing multi-modal prompts, and handling responses.

Integrate Gemini and Imagen APIs into your Flutter applications using the `firebase_ai` package 🪄🔥 In this video, you'll discover different model types for generative content and image generation, constructing multi-modal prompts, and handling responses.

Flutter

14,874 views • 2 months ago

The new generation of YNs really built different 😭

The new generation of YNs really built different 😭

Hood Wild

164,801 views • 4 months ago

My canvas based AI image generation tool is live! It's built on top of tldraw and uses Nano Banana Pro for image generation. You can sketch, annotate, collage in a frame... And then click to generate an image. Check it out 👉

My canvas based AI image generation tool is live! It's built on top of tldraw and uses Nano Banana Pro for image generation. You can sketch, annotate, collage in a frame... And then click to generate an image. Check it out 👉

Charlie Clark

44,335 views • 6 months ago