DVD Screensaver Component

Refinery

DVD Screensaver

Bouncing logo screensaver with color shifts on bounce.

Preview

DVDPlayer

bounces: 0
corners: 0

(move your mouse to exit screensaver)

Installation

1. Run the following command in your terminal:

npx shadcn@latest add https://refinery.abhii.me/r/dvd-screensaver.json

API Reference

Component props
Name	Type	Description
text	string	Main logo text.
subText	string	Secondary label below the logo.
speed	number	Movement speed multiplier for the bounce.
className	string	Additional CSS classes for the wrapper.

Usage Recommendations

Use short brand text for legibility at small sizes.

See the 'Usage Hints' section on the left to learn how to apply screensaver into your app.

Design Notes

Motion values is used for position and velocity, then are updated on each animation frame. The logo bounces against the container edges and shifts through a predefined color palette on every bounce. You can swap the text, subtext, or speed to make it feel closer to your own idle-screen moment.