🍸 Liquid Glass Framework

A lightweight, Apple-inspired CSS framework that brings beautiful glassmorphism and frosted-glass effects to your web UI.

✨ Features

• 🌫️ Glassmorphism & Blur Effects — modern frosted-glass UI
• 💎 Apple-style Components — minimal, elegant, responsive
• ⚙️ Lightweight — under 10KB minified
• 🎨 Easy to Customize — built with PostCSS and variables
• 📦 Ready for npm & CDN

🚀 Demo

🔗 Live Demo: https://xxvertex.github.io/liquid-glass-framework/

🧱 Installation

Option 1 — via npm

npm install @xxvertex/liquid-glass-framework

Then import in your project:

<link rel="stylesheet" href="node_modules/@xxvertex/liquid-glass-framework/dist/liquid-glass.min.css">

Option 2 — via CDN

You’ll be able to use it directly in HTML:

jsDelivr

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@xxvertex/liquid-glass-framework@latest/dist/liquid-glass.min.css">

UNPKG

<link rel="stylesheet" href="https://unpkg.com/@xxvertex/liquid-glass-framework@latest/dist/liquid-glass.min.css">

💡 Usage Example

<div class="lg-card">
  <h3>Liquid Glass</h3>
  <p>Frosted, smooth, and elegant.</p>
</div>

<button class="lg-button">Press Me</button>

🧩 Build From Source

If you’re modifying the framework:

npm install
npm run build

Output will appear in:

dist/liquid-glass.min.css

📜 License

This project is licensed under the MIT License. See the LICENSE file for more details.

💬 Contributing

Pull requests are welcome! If you’d like to add new components or improve the build process, open an issue or PR.

🧠 Author

Oliver Kent Santos (xxVertex) 📧 [email protected] 🌐 https://github.com/xxVertex