Getting Started

Start including production-ready CSS from Luxa CSS and efficiently streamline your development.

Luxa CSS is a starting point for a clean and lightweight design system that aims for minimalism, speed, and ease of maintenance.

By adopting Luxa, you can avoid complex and hard-to-adjust CSS structures. This choice leads to a more efficient development process and enhances your project’s performance.

There are three ways to get started:

Install manually

Download the latest version and link the CSS in the <head> of your website.

Install from CDN

Alternatively, you can easily include Luxa CSS in your project using a CDN. Choose the version that suits your needs:

<!-- 🦣 Expanded - 8KB -->

<!-- 🦐 Compressed - 6KB -->

Install with a package manager

npm i luxacss

pnpm i luxacss

bun i luxacss

Then import it into your main layout/page:

import "luxacss";

Or, import Luxa into your .scss file with @use:

@use "luxacss";


Luxa ships with some opinionated base styles; most of these go unnoticed and make things behave more like expected. You can check these here: Reset.