Vibe Kibana

Designers at Elastic had ideas for complex, interactive features but no practical way to prototype them in code without wading through a large, unfamiliar codebase. I built Vibe Kibana to fix that.

It is a standalone design playground that runs the same stack as Kibana (React, TypeScript, EUI, and Elastic Charts) but is stripped down to just what designers need. You can start from a template (Dashboards, Discover, and more), iterate on multiple versions of your work, leave Figma-style comments for collaborators, and easily deploy a live prototype, all without ever touching the Kibana repo.

The environment ships with a curated component library covering the most common Kibana UI patterns, realistic data generators so prototypes feel populated, and a designer toolbar with version switching, light and dark mode toggle, and project metadata. That last one matters more than it sounds: Kibana itself does not have a one-click theme toggle in production, so being able to instantly switch modes inside a code-accurate prototype fills a real gap in the design validation workflow.

I built and maintain the entire platform, from the architecture and component library to the deployment pipeline, documentation, and contributor onboarding. It has been adopted across our 30-person design organization and has more than 10 active forks.