lucUI Logo

lucUI

Our open-source CSS framework with beautiful glassmorphism, fluid 3D shadows, and micro-animations.

The lucUI Design System

Created on April 28, 2026 and launched on May 25, 2026, lucUI is the official open-source design library of the luca.ecosystem. Co-developed by `luca.designss` (creative design tokens) and `luca.softss` (infrastructure & layout classes), it controls the visual identity of every ecosystem platform.

Instead of generic borders and solid backgrounds, lucUI centers on enhanced glassmorphism and depth layers, creating real 3D visual hierarchy. It's completely free, lightweight, and customizable.

Framework Versions

v1.0

First Release

May 25, 2026. Standardized CSS variables, typography classes, base buttons, alerts, and the basic glassmorphism rendering tags.

v1.1

Grid Refinement

July 2, 2026. Added layout helper grids, responsive columns, and updated shadow parameters to improve render performance on mobile devices.

v2.0 (Latest)

3D Depth & Themes

July 10, 2026. Introduced fluid 3D depth shadows, custom micro-animations (e.g. spring hover transitions), and integrated multi-theme layouts.

Core Classes Showcase

1. luc-glass

Applies high-quality backdrop blurring, border highlights, and semi-transparent gradients.

<div class="luc-glass">
  <p>Glassmorphic content</p>
</div>

2. luc-glass-depth

Incorporates enhanced dropshadows and internal border highlights to build a real 3D stack.

<div class="luc-glass luc-glass-depth">
  <p>3D Layered card</p>
</div>

Multi-Theme Integration

Standardizing light-dark-midnight modes. By referencing `data-theme` on the `html` element, the framework overrides color tokens seamlessly. Try clicking the switches in our navbar to see the themes live!

light dark midnight sunrise