vtx-css-loaders

1.0.2 • Public • Published

CSS Loaders - Lightweight CSS Loading Animations

A lightweight, reusable CSS-only loading animation library for web projects. No JavaScript required! 🚀

📦 Installation

Using npm

Install via npm:

npm install vtx-css-loaders

🚀 Usage

1️⃣ Direct Import (Recommended)

Import the library in your main CSS file:

@import 'vtx-css-loaders/dist/loaders.min.css';

Now, you can use the loaders in your HTML:

<div class="loader">
	<div class="bars">
		<div></div>
		<div></div>
		<div></div>
	</div>
</div>

2️⃣ Using a <link> Tag (If Using a CDN)

If you want to use the library without npm, you can load it via a CDN :

<link
	rel="stylesheet"
	href="https://cdn.jsdelivr.net/npm/vtx-css-loaders/dist/loaders.min.css"
/>

3️⃣ Copy & Modify (Advanced Users)

If you want full control, you can copy the CSS file into your project:

cp node_modules/vtx-css-loaders/dist/loaders.min.css styles/custom-loaders.css

Modify styles/custom-loaders.css as needed.


🎨 Customization (CSS Variables)

Instead of editing the library, you can override CSS variables in your own stylesheet:

:root {
	--loader-color: red;
	--loader-size: 30px;
}

This will change the color and size of all loaders!


📜 License

This project is licensed under the MIT License – free to use, modify, and distribute.


✨ Contributing

Want to add more animations? Feel free to fork the project and submit a pull request!


📞 Support

If you run into issues, open an issue on GitHub.


Happy coding! 💻🔥

Package Sidebar

Install

npm i vtx-css-loaders

Weekly Downloads

6

Version

1.0.2

License

MIT

Unpacked Size

16.5 kB

Total Files

5

Last publish

Collaborators

  • seseshe