సిఎస్ఎస్ ఫిల్టర్లు అంటే ఏమిటి?

ఒక ఎలిమెంట్ కు బ్లర్ లేదా కలర్ షిఫ్టింగ్ వంటి గ్రాఫికల్ ఎఫెక్ట్ లను అప్లై చేయడానికి CSS ఫిల్టర్ లు మిమ్మల్ని అనుమతిస్తాయి. అవి సాధారణంగా చిత్రాలు, నేపథ్యాలు మరియు సరిహద్దుల కోసం ఉపయోగించబడతాయి.

బాహ్య ఇమేజ్ ఎడిటింగ్ సాధనాల అవసరం లేకుండా విజువల్ ఎఫెక్ట్ లను సృష్టించడానికి, ఇమేజ్ లను మెరుగుపరచడానికి లేదా ప్రత్యేకమైన డిజైన్ ఎలిమెంట్ లను సృష్టించడానికి ఫిల్టర్లను ఉపయోగించవచ్చు.

మద్దతు ఉన్న CSS ఫిల్టర్ గుణాలు

• blur()- మూలకానికి గాసియన్ బ్లర్ను వర్తింపజేస్తుంది.
• brightness()- మూలకం యొక్క ప్రకాశాన్ని సర్దుబాటు చేస్తుంది.
• contrast()- మూలకం యొక్క కాంట్రాస్ట్ను సర్దుబాటు చేస్తుంది.
• grayscale()- మూలకాన్ని బూడిద రంగులోకి మారుస్తుంది.
• hue-rotate()- మూలకానికి రంగు భ్రమణాన్ని వర్తింపజేస్తుంది.
• invert()- మూలకం యొక్క రంగులను ఇన్వర్ట్ చేస్తుంది.
• opacity()- మూలకం యొక్క పారదర్శకతను సర్దుబాటు చేస్తుంది.
• saturate()- మూలకాన్ని సంతృప్తం చేస్తుంది లేదా నిర్వీర్యం చేస్తుంది.
• sepia()- మూలకాన్ని సెపియాగా మారుస్తుంది.

ఫిల్టర్లను ఎలా అప్లై చేయాలి

ఈ టూల్ ద్వారా జనరేట్ చేయబడ్డ CSS కోడ్ ఉపయోగించి, మీరు ఏదైనా HTML ఎలిమెంట్ కు ఫిల్టర్ లను అప్లై చేయవచ్చు. ఇదిగో ఇలా:

.filtered-image { filter: blur(5px) brightness(110%) contrast(120%); }

filter: blur(2px) brightness(110%) contrast(120%) saturate(150%);

బ్రౌజర్ అనుకూలత

క్రోమ్, ఫైర్ఫాక్స్, సఫారీ, ఎడ్జ్ మరియు ఒపెరాతో సహా ఆధునిక బ్రౌజర్లలో సిఎస్ఎస్ ఫిల్టర్లు విస్తృతంగా మద్దతు ఇవ్వబడతాయి. అయితే, ఇంటర్నెట్ ఎక్స్ ప్లోరర్ వంటి పాత బ్రౌజర్లు వాటికి మద్దతు ఇవ్వవు.