Elevated Card
Elevated Card
Multi-layered box-shadow creates a floating effect.
<div style="background:#1e1e2e;border-radius:16px;padding:24px;box-shadow:0 2px 4px rgba(0,0,0,0.1),0 8px 16px rgba(0,0,0,0.15),0 16px 32px rgba(0,0,0,0.2);max-width:320px;color:#e0e0e0"><h3 style="margin:0 0 8px;font-size:1.2em">Elevated Card</h3><p style="margin:0;opacity:0.8;font-size:0.9em">Multi-layered box-shadow creates a floating effect.</p></div>Customize
#1e1e2e
px
px
Props
| Name | Type | Default | Description |
|---|---|---|---|
text | text | Elevated Card | Displayed text |
bgColor | color | #1e1e2e | Card background color |
borderRadius | slider (px) | 16px | Corner roundness |
padding | slider (px) | 24px | Inner spacing |
Elevated floating card