Installation

Get Solora running in your project in under two minutes. Works with any HTML page, bundler, or framework.

Via npm

The recommended way to install Solora is through npm:

npm install @kerkhoff-ict/solora

Then import in your project:

import '@kerkhoff-ict/solora/dist/index.css';
import { initCodeblocks, initDropdowns, initThemeToggle } from '@kerkhoff-ict/solora/dist/index.js';

// Initialise components
initCodeblocks();
initDropdowns();
initThemeToggle();

Via CDN

For quick prototyping, use the CDN version in your HTML:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@kerkhoff-ict/solora/dist/index.css">
<script type="module">
  import { initCodeblocks, initDropdowns } from 'https://cdn.jsdelivr.net/npm/@kerkhoff-ict/solora/dist/index.js';
  initCodeblocks();
  initDropdowns();
</script>

CSS Variables

Customise Solora by overriding the CSS variables in your own stylesheet:

:root {
  --color-primary: #6366f1;      /* your brand color */
  --color-text-light: #ffffff;
  --color-text-dark: #1d1d1f;
}
💡 Tip All Solora components inherit from these variables, so changing --color-primary instantly re-themes every component.

Next Steps

Now that you're set up, explore the components: