CSS Functions

CSS Functions Examples

CSS Functions are used to achieve certain values for specific effects and styles.Common CSS functions:

1. Color - rgb(), rgba(), hsl(), hsla()
2. Mathematical - calc(), min(), max()
3. Transformation - rotate(), scale(), translate(), skew(), matrix()
4. Gradient - linear-gradient(), radial-gradient()
5. Image - url(), image()
6. Filter - blur(), contrast(), invert(), saturate(), sepia() etc
7. Color Manipulation - lighten(), darken(), alpha(), desaturate() etc

counters()

Enables nested counters. I was always wondering how to create nested ul/ol as validation doesn't allow ol/ul nested in another ul/ol.

blur()

blur() is used to blur the image.

skew()

skew() transforms elements on the 2D plane.

conic-gradient()

conic-gradient() creates gradients with color transitions rotated around a center point.