UI Showcase - Lockness Components

Lockness UI Component

GETTING STARTED

Welcome to the Lockness UI component library. A collection of beautifully designed components built with Hono JSX, Tailwind CSS, and Unpoly.

INSTALLATION

You can use components in two ways:

CLI Mode (Recommended)

Copy components directly to your project for full control and customization.

deno run -A jsr:@lockness/ui add button

Library Mode

Import components directly from the package for quick prototyping.

import { Button, Card } from '@lockness/ui/components'

FEATURES

  • ▸Type-safe: Built with TypeScript for full type safety
  • ▸Composable: Components designed to work together seamlessly
  • ▸Accessible: WAI-ARIA compliant with keyboard navigation
  • ▸Themeable: Full dark mode support with CSS variables
  • ▸Progressive Enhancement: Powered by Unpoly for smooth, JavaScript-light interactions

NAVIGATION

Use the sidebar menu to explore all available components. Each section provides live examples and usage patterns.