← Components/Cards

GlowCard

hoverglowradial
glowcard-v1.tsx
import React from 'react';
import './GlowCard.css';

interface GlowCardProps {
  children: React.ReactNode;
}

const GlowCard: React.FC<GlowCardProps> = ({ children }) => {
  return (
    <div className="glow-card">
      {children}
    </div>
  );};

export default GlowCard;

Component info

CategoryCards
Frameworkreact
TierPREMIUM
Views5
Copies0

Dependencies

npm install tailwindcss

About

A premium React card component that emits a pulsing radial glow from its center when hovered. The glow effect is achieved using CSS and utilizes the #C9A84C gold color from the Empire palette. The card is designed to be used on a dark background, specifically #0A0A0A black, to maximize the visual impact of the glow effect. This component is built using TypeScript and does not include any console logs. It is exported as a default module, making it easy to import and use in your React applications. With a high quality score of 90, this component is a valuable addition to any project requiring interactive and visually appealing card components.

Pro component
Unlock this component and 17,500+ more with Empire UI Pro.
Get Pro →