· · ·
                ·           ·
              ·               ·
            ·                   ·
           ·                     ·
          ·                       ·
          ·                       ·
          ·                       ·
           ·                     ·
            ·                   ·
              ·               ·
                ·           ·
                    · · ·

PIVOINE.ART

Technology and sound, creating massive beats to push the boundaries of audio perception.

---

About

An immersive audio experience. Electronic music meets WebGL visualization. 5000 particles react to every frequency. The logo breathes with the beat.

Dark. Minimal. Precise.

---

Features

▸ WebGL Visualizer     5000 particles · 512 FFT · bass/mid/high reactivity
▸ Reactive Logo        Canvas-based · audio-driven · mouse-aware
▸ Persistent Player    Play · seek · volume · progress
▸ Web Audio API        Real-time frequency analysis
▸ SPA Navigation       htmx · smooth transitions · Alpine.js state

---

Stack

Hugo ─────────────── Static site generation
Tailwind CSS 4 ───── Utility-first styling
Alpine.js ────────── Lightweight reactivity
Three.js ─────────── WebGL rendering
Web Audio API ────── Frequency analysis
pnpm ─────────────── Package management

---

Development

# Install dependencies
pnpm install

# Development server
pnpm dev

# Build for production
pnpm build

---

Deploy

# Build image
docker build -t pivoine-art .

# Run container
docker run -p 8080:80 pivoine-art

---

Structure

├── assets/
│   ├── css/          # Tailwind source
│   └── js/           # Visualizer · Logo · Main
├── config/           # Hugo configuration
├── content/          # Markdown content
├── layouts/          # Hugo templates
└── static/           # Compiled assets

---

Author

Valknar valknar@pivoine.art

---

License

All audio content © Valknar. All rights reserved. Code: MIT