bansal / Filters.css
CSS only library to apply color filters.
Stars: ✭ 318
Projects that are alternatives of or similar to Filters.css
Smart Css Grid
SMART CSS GRID - CSS Framework
Stars: ✭ 291 (-8.49%)
Mutual labels: css-framework, css3
Pattern.css
CSS only library to fill empty background with beautiful patterns.
Stars: ✭ 3,481 (+994.65%)
Mutual labels: css-framework, css3
Stylizer
Stylizer is a flexible Css framework based on the visual aspect, the framework offers you a clean and easy work.
Stars: ✭ 44 (-86.16%)
Mutual labels: css3, css-framework
Bootstrap4 Website
Website built with bootstrap 4 Framework
Stars: ✭ 124 (-61.01%)
Mutual labels: css-framework, css3
Shorthand
Feature rich CSS framework for the new decade https://shorthandcss.com
Stars: ✭ 230 (-27.67%)
Mutual labels: css-framework, css3
Cirrus
☁️ The CSS framework for the modern web.
Stars: ✭ 716 (+125.16%)
Mutual labels: css-framework, css3
strawberry
A new flexbox based CSS micro-framework.
Stars: ✭ 71 (-77.67%)
Mutual labels: css3, css-framework
sass-structure
Sass folder structure => organizing project files.
Stars: ✭ 32 (-89.94%)
Mutual labels: css3, css-framework
Tacit
CSS Framework for Dummies, Without Classes
Stars: ✭ 1,344 (+322.64%)
Mutual labels: css-framework, css3
Flex One
1 CSS Class Layout System made with Flex
Stars: ✭ 47 (-85.22%)
Mutual labels: css-framework, css3
H5ui
Lightweight, elegant open source mobile UI style library.
Stars: ✭ 44 (-86.16%)
Mutual labels: css-framework, css3
Bahunya
10KB classless CSS framework with responsive typography, navbar, syntax highlighting, etc.
Stars: ✭ 170 (-46.54%)
Mutual labels: css-framework, css3
Agilejs
AgileJS - The Css3 Creation Engine 🍖🌭🍔
Stars: ✭ 489 (+53.77%)
Mutual labels: css-framework, css3
Hartija Css Print Framework
Universal CSS for web printing
Stars: ✭ 509 (+60.06%)
Mutual labels: css-framework, css3
swatch
A lightweight, modern theming library based on CSS variables and the setter/getter pattern.
Stars: ✭ 14 (-95.6%)
Mutual labels: css3, css-framework
Katana
Katana is CSS Layout System made with Flexbox
Stars: ✭ 57 (-82.08%)
Mutual labels: css3, css-framework
filters.css
CSS only library to apply color filters.
See the full documentation
Features
- Only CSS. No JavaScript!
- ~1KB minified and gzipped!
- Supports all modern browsers
- Built with SCSS.
- Hover support.
Installation
via npm
npm install filters.css
via cdn
<link href="https://unpkg.com/filters.css" rel="stylesheet">
download
<link href="dist/filters.min.css" rel="stylesheet">
Usage
filters.css can be used with any css framework.
example
<img src="..." class="blur-3" />
Filter Classes
| class format | example | hover |
|---|---|---|
| blur-{0-10} | .blur-3 |
.hover-blur-3 |
| grayscale-{0-10} | .grayscale-3 |
.hover-grayscale-3 |
| brightness-{0-10} | .brightness-3 |
.hover-brightness-3 |
| contrast-{0-10} | .contrast-3 |
.hover-contrast-3 |
| invert-{0-10} | .invert-3 |
.hover-invert-3 |
| saturate-{0-10} | .saturate-3 |
.hover-saturate-3 |
| sepia-{0-10} | .sepia-3 |
.hover-sepia-3 |
| backdrop-blur-{0-10} | .backdrop-blur-3 |
.hover-backdrop-blur-3 |
| opacity-{0-10} | .opacity-3 |
.hover-opacity-3 |
License
MIT
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].