Free Webinar β Building for Scale with Pion & Webflow
0.1.0
Holographic Card
Card with holographic foil effect using WebGL shader, creating rainbow iridescence.
Card with holographic foil effect using WebGL shader, creating rainbow iridescence.
Features
- β Zero dependencies - Pure React implementation
- β Full accessibility - ARIA labels, keyboard navigation, screen reader support
- β Theme support - Light, dark, and auto modes
- β Reduced motion support - Respects user preferences
Props
intensity
- Type:
number- Default:0.8 - Holographic effect intensity (0-1)
theme
- Type:
'light' | 'dark' | 'auto'- Default:'auto' - Theme mode
className
- Type:
string - Additional CSS class
children
- Type:
ReactNode - Card content
Customization
Webflow Classes
Target these classes in Webflow Designer for custom styles:
.cc-holographic-card.cc-holographic-card__canvas.cc-holographic-card__content