Welcome to LostCSS

A modern CSS framework with smooth animations

✨

Modern Design

Clean, minimalist components with subtle animations

⚡

Fast & Light

Only 12KB gzipped with all animations included

🎨

Customizable

Easy to customize with CSS variables

How to Use LostCSS

1

Include LostCSS

Add this to your <head> section:

<link rel="stylesheet" href="https://lostcss.neocities.org/lost.css">
2

Use the Classes

Add LostCSS classes to your HTML elements:

<button class="btn primary hover-pulse">Click Me</button>
<div class="card animate-slide-up">...</div>
3

Customize

Override CSS variables in your own stylesheet:

:root {
    --primary: #your-color;
    --radius: 1rem;
}
4

Animate

Add animation classes like:

  • animate-float - Floating animation
  • animate-fade-in - Fade in effect
  • hover-shake - Shake on hover
  • hover-spin - Spin on hover