Skip to main content

Assets Templates Inspiration Components

Components/Magic UI

Glare Hover

Glare Hover

Pro

A diagonal light glare on hover using a ::before gradient, CSS variables, and background-position animation—no extra global keyframes required.

Category: Cards
Built with: React, Tailwind
Installs: Nothing extra
Files: glare-hover.tsx

The prompt tells your agent to rebuild the styles on your project's tokens, so it fits in like it was made there.

Magic UI

by Dillion Verma

76 components

Copyright (c) Magic UI. Open source, added by Craftwork. The license line stays in the copied code.

More like this

Tilt Card

Tilt Card

FreeOpen

Case Study Flip Stack

Case Study Flip Stack

Skeuomorphic Music Card

Skeuomorphic Music Card

Client Tweet Card

Client Tweet Card

Flight Status Card

Flight Status Card

Code Comparison

Code Comparison

Hover Transition

Hover Transition

Card Hover

Card Hover