Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 

  • CSS filters

    @mukul.kant
    Recommendations Offline Message

    • 0
    • 35
    • 1
    • 4
    • 0
    • 0
    • 0
    • 0
    • 301
    Comment on it

    Hi all,

    This is an experimental technology
    Because this technology's specification has not stabilized, check the compatibility table for the proper prefixes to use in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the spec changes. MDN

    Filters are used to adjust the rendering of image, background or border.

    Syntax of filters:- 

    filter: blur(5px);
filter: brightness(0.4);
filter: contrast(200%);
filter: drop-shadow(16px 16px 20px blue);
filter: grayscale(50%);
filter: hue-rotate(90deg);
filter: invert(75%);
filter: opacity(25%);
filter: saturate(30%);
filter: sepia(60%);

    Below is some examples of filters -

    blur()

    img{filter: blur(2px);}
    MUKUL KANT

    brightness()

    img{filter: brightness(0.4);}
    MUKUL KANT

    contrast()

    img{filter: contrast(200%);}
    MUKUL KANT

    grayscale()

    img{filter:grayscale(50%);}
    MUKUL KANT

    drop-shadow()

    img{filter: drop-shadow(16px 16px 20px blue);}
    MUKUL KANT

    hue-rotate()

    img{filter: filter: hue-rotate(90deg);}
    MUKUL KANT

    invert()

    img{filter: invert(75%);}
    MUKUL KANT

    saturate()

    img{filter: saturate(30%);}
    MUKUL KANT

    sepia()

    img{filter: sepia(60%);}
    MUKUL KANT

    opacity()

    img{filter: opacity(25%);}
    MUKUL KANT
    CSS filters filters HTML5 HTML tags css3
    Comment on it

 0 Comment(s)

Sign In
Forgot Password?
                           OR                           
Create an account !!
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: