Texture Card

Cult UI

Cards with layered borders that create a subtle textured depth effect. Two variants: theme-aware (TextureCard) and styled (TextureCardStyled).

Full anatomy

Project Aurora

Next-generation design system

A complete design system built on layered textures and graduated borders. Every surface communicates depth through subtle material cues rather than drop shadows.

Updated 2 days ago

Styled variant (fixed radii)

Performance Metrics

Core Web Vitals dashboard

LCP

1.2s

FID

8ms

CLS

0.04

Minimal content

Layered Borders

Five nested border layers with graduated opacity create the signature texture effect. The outermost border anchors the card, while inner borders fade toward the content, producing a sense of physical depth without any shadow.