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 aiming for minimalism, speed and ease of maintenance.

Using it avoids intricate and difficult-to-tweak CSS structures, resulting in a more streamlined development process and better project 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, using a CDN, you can easily include Luxa CSS in your project. Choose the version that suits your needs:

<!-- 🦣 Expanded - 8KB -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/luxonauta/luxacss@latest/dist/expanded/luxa.css"
/>

<!-- 🦐 Compressed - 6KB -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/luxonauta/luxacss@latest/dist/compressed/luxa.min.css"
/>

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";