jabroni.net
Exploring
Demos
Guides
Sections
Stack
What powers this
Built with
Interactive demos
Playground
Self-contained experiments — maps, audio, 3D, charts, shaders, and dev tools. Each one runs live in your browser.
Leaflet map
Client-only Leaflet map with tiles, markers, and cleanup.
FullCalendar
Scheduling UI with day grid, time grid, and list views.
Pitchy detector
Microphone-driven pitch graph with tuning controls.
Peaks.js waveform
Waveform layout with zoom + overview setup guidance.
D3 chart
Responsive D3 area + line chart with axes and gridlines.
Three.js scene
Minimal Three.js scene with resize handling and cleanup.
Component Lab
Interactive prop panels with live code preview for 7 UI components.
API Explorer
Fetch any API endpoint and inspect status, headers, body, and timing.
CSS Animator
Visual CSS keyframe animation builder with live preview and code export.
Shader Art
Live GLSL fragment shader editor with WebGL preview and presets.
Code Sandbox
Tabbed HTML/CSS/JS editor with live preview, console, and presets.
Reactive Smoke
WebGL volumetric smoke with beat detection, shockwaves, and 5 color themes.
CRT Oscilloscope
Retro lab-grade oscilloscope with waveform, spectrum, Lissajous, and VU meter modes.
Theme Lab
Preview theme colors, typography, toasts, buttons, inputs, and form elements.
Workflow DAG
Visual DAG workflow builder with typed nodes, bezier edges, and execution simulation.
Technical reference
Guides
Focused writeups on patterns, integrations, and techniques. Written to be referenced, not just read once.
Architecture
- Route groups for docs and labs
- Load ownership in +page.server.ts
Audio
- Pitchy pitch detection best practices
- Peaks.js waveform best practices
Components
- Component catalogs with typed props
Content
- SEO and route announcements
Data
- Parallel loads in nested guides
- Leaflet maps in SvelteKit
Performance
- bfcache-ready SvelteKit pages
Quality
- Accessible focus flow
Routing
- Layout shells in route trees
UI system
- Slot contracts for guide cards
Visualization
- D3 charts in SvelteKit
- Three.js scenes in SvelteKit
Workflow
- FullCalendar in SvelteKit
Developer experience
Built for tinkering
Keyboard-first navigation, fuzzy search, smooth transitions, and two polished themes.
Command palette
Fuzzy search everything. Jump to any page, guide, or demo instantly.
Ctrl KKeyboard-first
G+H home, G+G guides, G+P playground. Full shortcut system built in.
?Light & dark
OKLCH color system tuned for both themes. Perceptually uniform tokens.
TInstant transitions
View Transitions API for seamless navigation. Zero full-page reloads.
Ready to explore?
Dive in.
Pick a playground demo, read a guide, or press Ctrl K to search.