The best HTML, CSS, and JavaScript framework for developing responsive projects on the web with less code. By using this framework, JS and CSS code will be decreased. So many resources will be saved after using this framework
latest version(beta) not stable: cssuals@v1.0.3
Stable version will be released from 1.1.0
add one of below tag in head section of html by choice of your method (either offline or online method or minfied or original)
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hahsanayub/cssuals@v1.0.3/cssuals.css">
minified version
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hahsanayub/cssuals@v1.0.3/cssuals.min.css">
Download from url version v1.0.3, extract and placed it in your project. https://github.com/hahsanayub/cssuals/archive/refs/tags/v1.0.3.zip
<link rel="stylesheet" href="./cssuals-1.0.3/cssuals.css">
minified version
<link rel="stylesheet" href="./cssuals-1.0.3/cssuals.min.css">
-
There is a class
ft-px-1
. it set the thefont-size: 1px;
. From 1 to 100 pixl font-size can be setft-px-*
In * replace from 1 to 100 to set font size of text
Examples:
<p class="ft-px-1">Text of font size 1px</p>
output: Text of font size 1px
<p class="ft-px-2">Text of font size 2px</p>
output: Text of font size 2px
<p class="ft-px-3">Text of font size 3px</p>
output: Text of font size 3px
......uptoft-px-100
<p class="ft-px-100">Text of font size 100px</p>
-
There are 24 classes for font colors:
clr-white, clr-black, clr-grey, clr-silver, clr-maroon, clr-red, clr-purple, clr-fuchsia, clr-green, clr-blue, clr-orange, clr-yellow, clr-dark, clr-dark-light, clr-primary, clr-primary-light, clr-danger, clr-danger-light, clr-success, clr-success-light, clr-warning, clr-warning-light, clr-info , clr-info-light
Note:bg-black
is for background color black. I added inclr-white
to get visible white color
Examples:
<p class="clr-white bg-black">white</p>
Output: white
<p class="clr-black">black</p>
Output: black
<p class="clr-grey">grey</p>
Output: grey
<p class="clr-silver">silver</p>
Output: silver
<p class="clr-maroon">maroon</p>
Output: maroon
<p class="clr-red">red</p>
Output: red
<p class="clr-purple">purple</p>
Output: purple
<p class="clr-fuchsia">fuchsia</p>
Output: fuchsia
<p class="clr-green">green</p>
Output: green
<p class="clr-blue">blue</p>
Output: blue
<p class="clr-orange">orange</p>
Output: orange
<p class="clr-yellow">yellow</p>
Output: yellow
<p class="clr-dark">dark</p>
Output: dark
<p class="clr-dark-light">dark-light</p>
Output: dark-light
<p class="clr-primary">primary</p>
Output: primary
<p class="clr-primary-light">primary-light</p>
Output: primary-light
<p class="clr-danger">danger</p>
Output: danger
<p class="clr-danger-light">danger-light</p>
Output: danger-light
<p class="clr-success">success</p>
Output: success
<p class="clr-success-light">success-light</p>
Output: success-light
<p class="clr-warning">warning</p>
Output: warning
<p class="clr-warning-light">warning-light</p>
Output: warning-light
<p class="clr-info">info</p>
Output: info
<p class="clr-info-light">info-light</p>
Output: info-light
-
There are 24 classes for font colors: