Shadcn.io is not affiliated with official shadcn/ui
Music Vinyl Collection
A vinyl record collection display block for React and Next.js with cover placeholders, RPM info, condition ratings, pressing year, and CSS spin animation built with shadcn/ui and Tailwind CSS
Showcase a curated vinyl record collection with this interactive React and Next.js block. Features record cover placeholders with a CSS spin animation on hover, RPM indicators, condition grading, pressing year metadata, and a collection value summary. Built with TypeScript, shadcn/ui Badge and Button components, framer-motion entrance animations, and Tailwind CSS. Perfect for music store catalogs, collector portfolio pages, and vinyl marketplace listings.
Related Components
Studio Session Tracker
Recording session time and track logger
Concert Setlist Display
Live show setlist with durations
Mood Playlist Generator
Mood-based playlist with BPM ranges
Audio Settings Panel
Equalizer and audio output controls
Vinyl Collection Display
Vinyl record catalog with spin animation
FAQ
Was this page helpful?
Sign in to leave feedback.
Venue Finder
A music venue finder directory block for React and Next.js with venue cards, capacity filter, genre tags, star ratings, upcoming show counts, and location display built with shadcn/ui and Tailwind CSS
Vinyl Player
A vinyl turntable player block for React and Next.js with rotating record animation, tone arm, speed selector for 33 45 and 78 RPM, track info display, and play pause stop controls built with shadcn/ui and Tailwind CSS