Nucifera Logo Variations

Size Variations

Small (32px)

N U C I

F E R A

Medium (156px)

N U C I

F E R A

Large (200px)

N U C I

F E R A

Color Variations

White Variant

N U C I

F E R A

Color Variant (OKLCH)

N U C I

F E R A

Dark Variant (Light BG)

N U C I

F E R A

Animation States

Animated

N U C I

F E R A

Static

N U C I

F E R A

Text Options

With Text

N U C I

F E R A

Icon Only

Static SVG Files

White SVG

Color SVG

Dark SVG

Usage Examples

<!-- Import the component -->
import NuciferaLogo from '@/components/NuciferaLogo.astro';

<!-- Small logo for headers -->
<NuciferaLogo size="sm" variant="white" showText={false} />

<!-- Medium animated logo for hero sections -->
<NuciferaLogo size="md" variant="color" animated={true} />

<!-- Large static logo for brand pages -->
<NuciferaLogo size="lg" variant="white" animated={false} />

<!-- Or use SVG files directly -->
<img src="/icons/nucifera-white.svg" alt="Logo" width={24} height={24} />