Music Player Card
Dark music player card with a spinning vinyl cover, seek bar, play, skip, shuffle and repeat controls, volume slider and a clickable playlist.
Widgets
Small, self-contained interactive widgets.
10 component(s)
Weather Card with Forecast
Sky-blue weather card with a CSS-drawn sun and clouds, current conditions, quick stats, a 5-day forecast with range bars and a Celsius/Fahrenheit switch.
Back to Top Button with Scroll Progress
Round back-to-top button with an SVG ring that fills as you scroll, a percentage label and smooth scrolling, for the page or any scroll container.
Live Analog Clock
Live analog clock with CSS-rotated hands, conic-gradient ticks, a digital readout and optional time zone support, in pure CSS and vanilla JS.
Social Media Post Card
Dark Bootstrap 5 social post card with photo, double-tap like, save, native share with copy-link fallback and an inline comment thread.
Chat Widget
Tailwind CSS support chat widget with floating launcher, unread badge, message bubbles, suggested replies, typing indicator and Enter-to-send input.
Light/Dark Theme Toggle
Tailwind CSS dark mode toggle with an animated sun/moon switch that follows the system preference, remembers the choice and can reset to system.
Flip Countdown
Tailwind CSS flip-clock countdown timer with 3D split-flap cards for days, hours, minutes and seconds, reduced-motion support and a completion event.
Launch Countdown Card
Bootstrap 5 countdown card for product launches with a reminder button.
Countdown Timer Cards
Pure CSS countdown with days, hours, minutes and seconds in flip-style cards.