Holo is a component library for Vue 3. Inspired by over-the-top holographic user interfaces in sci-fi, it tries to strike a balance between usability, flexibility of customization, and crazy cool eye candy. Some call it form over function, but Holo tries to not skimp on the function. That said, by virtue of this design goal, it will not be suitable for every project.
NOTE! Holo is still in development. It won't be ready for a while, so take the rest of this readme and the docs with a grain of triangular salt.
- Intentionally open for extension and tinkering – not a comprehensive framework
- Wide range of customizable UI components
- Simple grid abstraction powered by CSS
- Theming with CSS custom properties
- Support for reactive color scheme preference
- Embracing modern web standards and ES features
- Fully written in typescript under the hood
- Cool sci-fi triangles
- And stuff...
Read the bespoke documentation online at holo.ovi.moe. It includes guides on installing, using, and customizing Holo. Reference for every component includes API documentation and examples.
To learn more about how the docs get made or contribute, see the docs readme.
Quick start for speed-runners. For us mortals, read the docs.
This guide uses npm. Adapt to whatever you use accordingly.
Holo requires Vue version 3.2 and up. It also likes to run in modern browsers.
npm install holo-vue in your Vue project
In your main.ts or main.js entry point file:
import { createApp } from 'vue'
import Holo from 'holo-vue' // Import the plugin (the default export)
import 'holo-vue/dist/style.css' // Import the stylesheet
import App from './App.vue'
const app = createApp(App)
app.use(Holo) // Register it
app.mount('#app')This isn't ready yet...
Speed-run is over, now read the docs anyway. Make a Root. Build the rest of the owl— er, app.
I'll get to it. :)