https://motion-primitives.com/docs/scroll-progress

https://motion-primitives.com/docs/text-morph

https://motion-primitives.com/docs/dialog

https://www.julienthibeaut.xyz/lab/underlay-action-sheet

https://www.ibelick.com/lab/curved-tab-bar

https://motion-primitives.com/docs/image-comparison

https://www.ibelick.com/lab/subtle-3d-carousel

https://motion-primitives.com/docs/text-shimmer

https://www.julienthibeaut.xyz/lab/progressive-blur

https://www.julienthibeaut.xyz/blog/creating-metallic-effect-with-css

motion-primitives.com/docs/infinite-slider

https://motion-primitives.com/docs/cursor

motion-primitives.com/docs/animated-background

motion-primitives.com/docs/transition-panel

https://motion-primitives.com/docs/text-loop

motion-primitives.com/docs/animated-group

https://motion-primitives.com/docs/disclosure

https://motion-primitives.com/docs/text-effect

https://www.julienthibeaut.xyz/lab/fractal-glass

https://motion-primitives.com/docs/border-trail

https://www.julienthibeaut.xyz/lab/vision-os-icon

https://www.ibelick.com/lab/3d-photo-carousel-2

https://motion-primitives.com/docs/in-view

Tilt component

motion-primitives.com/docs/tilt

Animated Scroll Progress now live on motion-primitives

https://motion-primitives.com/docs/scroll-progress

Introducing Text Morph:  
Animates text by morphing shared letters between words. 

https://motion-primitives.com/docs/text-morph

New Dialog component for motion-primitives.

https://motion-primitives.com/docs/dialog

Spinning Text 

code: motion-primitives.com/docs/spinning-…

Made this underlay action sheet with framer-motion

Code and demo here: https://www.julienthibeaut.xyz/lab/underlay-action-sheet

New Accordion component for motion-primitives.

motion-primitives.com/docs/accordion

Made a curved tab bar, inspired by the PlayStation mobile app

Check out the code and demo
https://www.ibelick.com/lab/curved-tab-bar

Image Comparison: Customize spring, slider, and more

https://motion-primitives.com/docs/image-comparison

Subtle 3D carousel

https://www.ibelick.com/lab/subtle-3d-carousel

Text Shimmer

https://motion-primitives.com/docs/text-shimmer

Experimenting with progressive blur effects, made in CSS.

Code and playground: https://www.julienthibeaut.xyz/lab/progressive-blur

made a metallic button today

and then I wrote a bit on how to create this kind of old-school effect https://www.julienthibeaut.xyz/blog/creating-metallic-effect-with-css

I made a collection of Tailwind CSS buttons, it's free, easy to integrate with a simple copy-paste, no javascript.

This will be my evolving collection, I will add new styles and micro-interactions soon. Feel free to star the GitHub repo for updates 

https://buttons.ibelick.com/

Introducing Motion-Primitives Pro: building blocks to help you build a beautiful website, faster.

Pre-order for early access to over 50+ beautiful building blocks, sections and templates at a significant discount.

Available January 2025.

https://pro.motion-primitives.com/

Nice effect with Motion-Primitives by combining Tilt and Spotlight components, simple as this

<Tilt>
  <Spotlight>
    ...
  </Spotlight>
</Tilt>

New Infinite Slider component. Change speed on hover, vertical or horizontal layout.

 code here: motion-primitives.com/docs/infinite-slider

Introducing Cursor component for motion-primitives

https://motion-primitives.com/docs/cursor

3D photo carousel

ibelick.com/lab/3d-photo-carousel

Just added Animated background to motion-primitives!

Now in the documentation with examples.

motion-primitives.com/docs/animated-background

Introducing Motion-Primitives: a foundational library of motion components that you can easily integrate into your apps.

It's currently in early beta, expect significant updates and many more components soon!

motion-primitives.com

little timeline / progress indicator / navigation component

Little popover menu created with framer-motion, inspired by the Family app

Just added Transition Panel to motion-primitives

motion-primitives.com/docs/transition-panel

Text Loop

https://motion-primitives.com/docs/text-loop

Animated Group, easily animate lists, grids,  and collections with presets or custom variants.

motion-primitives.com/docs/animated-group

Disclosure component is now live!

https://motion-primitives.com/docs/disclosure

polaris buttons 

added to http://buttons.ibelick.com/

Popover slide selector

ibelick.com/lab/popover-sl…

Text Effect component now live on motion-primitives

https://motion-primitives.com/docs/text-effect

Spotlight component: easily create a classic spotlight effect that follows the cursor

motion-primitives.com/docs/spotlight

just shipped a Lab section on my website:

It's where I'll drop component ideas, play with UI, mostly built with React and Tailwind CSS, all open source, and easy copy/paste code

https://www.julienthibeaut.xyz/lab

New project: A curated collection of animations crafted for Tailwind CSS.

Simply copy/paste any animation you like, then add it directly into your Tailwind project.

I will add more animations soon!

https://animation.ibelick.com/

Gooey menu, made with SVG filters, linear() easing, and Tailwind CSS  

https://www.ibelick.com/lab/gooey-menu

New CSS exploration on my site: fractal glass.

You can find the code and an interactive playground here
https://www.julienthibeaut.xyz/lab/fractal-glass

Just added Border Trail to motion-primitives.

An animated border that adapts to any container, easy to stylize, update the transition, and more.

https://motion-primitives.com/docs/border-trail

My new tiny open-source project is out: a collection of modern background snippets. Copy/paste to integrate into your project.

For the moment, these are Tailwind CSS snippets. I will add Vanilla CSS 

https://bg.ibelick.com/

Text Scramble: Easy customization for duration, speed, custom trigger and character set

motion-primitives.com/docs/text-scramble

experiment of the day: I recreated the visionOS app icon for the web using framer motion.

https://www.julienthibeaut.xyz/lab/vision-os-icon

new carousel exploration

https://www.ibelick.com/lab/3d-photo-carousel-2

New Dock component available!

https://motion-primitives.com/docs/dock

Feeling nostalgic, so I recreated the classic "Slide to Unlock" feature from early iOS.

New InView component added to motion-primitives. 

Easily trigger animations when elements are in the viewport

https://motion-primitives.com/docs/in-view

Posts