Components

Discover all the components in the Solora UI library. Each component is designed with Apple's Human Interface Guidelines in mind, featuring clean aesthetics, smooth animations, and comprehensive dark mode support.

🔘

Button

Versatile buttons with multiple variants, sizes, and interaction states.

📝

Input

Text inputs with validation, error states, and glassmorphism effects.

📋

Dropdown

Accessible dropdown selects with groups, search, and smooth animations.

☑️

Checkbox & Radio

Apple-inspired checkboxes and radios with group management and limits.

💬

Popover

Flexible popovers with 8 positioning options and backdrop blur effects.

💻

Codeblock

Syntax-highlighted code blocks with macOS-style chrome and copy functionality.

const hello = "world";
🎨 All components include
  • Automatic dark mode support with glassmorphism effects
  • Smooth animations and hover states
  • Full accessibility compliance
  • Zero dependencies and lightweight
  • Apple-inspired design language

Getting Started

All components are automatically initialized when you call initAll(). No need to initialize them individually — everything works out of the box. 

import('@kerkhoff-ict/solora/dist/index.js')
  .then(sol => sol.initAll());