Motfx loading
This tailwind example is contributed by Nyambat Byamba, on 19-Aug-2024. Component is made with Tailwind v3.4. It is responsive.
Related Examples
-
Applications Showcase
This is a stylish and interactive application showcase component designed for web use. It features the following elements: Background Styling: The main container has a rounded-rectangle shape (rounded-3xl) with a subtle white base overlaying a high-resolution background image, styled with background-size: 600px for an artistic touch. The image itself dynamically serves as a backdrop, giving the component a layered appearance. Main Icon: A small circular icon, located at the top-right corner, appears with smooth hover effects: Enlarges to double its size (scale-[2]). Rotates (rotate-[410deg]). Moves diagonally upwards-right (translate-x-3, -translate-y-3). These transitions occur over a duration of 1 second (transition duration-1000). Overlay Gradient: A transparent gradient overlay (bg-gradient-to-l) adds a polished depth effect, transitioning from black (from-black/80) to lighter shades. App Icon and Info: Icon: The app icon is a smaller, bordered square image (rounded-2xl) with hover shrink animations (group-hover:scale-95). Text: A bold application title (text-md font-semibold) with hover-animated underline effects that gradually expand from left to right. A short app description styled as secondary text. Call-to-Action Button: Below the card is a subtle, rounded button (rounded-full) encouraging interaction. It features: A hover effect with color inversion (gray to black). A lift effect (hover:-translate-y-1) when hovered. This component is perfect for modern app showcases, offering a dynamic, user-friendly visual experience. It ensures a professional look while engaging users through smooth animations and clear calls to action.
3.5k -
Premium Button Collection with 12 Unique Animations
Collection de 12 boutons premium avec animations uniques : glow, shine, slide, 3D push, neon pulse, glassmorphism, gradient border et plus. Chaque bouton a son propre effet hover. 100% Tailwind CSS, no JavaScript.
1.2k -
Color changing button
changes the color of a button automatically and continuously
9.1k -
Social buttons
Mono-color Social buttons change colors according to your need
12.4k -
Button
Material Button
3k -
Ultimate Tailwind CSS Buttons
A collection of modern Tailwind CSS buttons featuring gradients, shimmer effects, glassmorphism, cyberpunk styles, 3D interactions, and more.
-
Call to Action (for app stores)
Download app section with Playstore and Appstore button
12.2k -
Life Tree
by salvator
1.3k -
Image Card
An image. Shows title and description info when hovering. Image zooms and darkens when hovering.
1.2k -
Button with hover to button shadow
A beautiful button with a special shadow
1.9k
Browse by topic
Explore components by Tags
Jump straight to the UI pattern you need.
Can't find it?
Didn't find the component you were looking for?
Search across 3,000+ community-built components and grab the code in seconds.