🎚️CSS ફિલ્ટર જનરેટર

filterનાં ફંક્શન અને એકમો

CSSની filter પ્રોપર્ટી ઇમેજ કે એલિમેન્ટના દેખાવ પર ઇફેક્ટ લગાડતી પ્રોપર્ટી છે, જેમાં blur, sepia જેવા ફંક્શન સ્પેસથી અલગ કરીને લખાય છે.

• px (પિક્સેલ)：blur ફંક્શન બ્લરની ત્રિજ્યા pxમાં નક્કી કરે છે; 4px આપવાથી 4 પિક્સેલની ત્રિજ્યામાં રંગો ભળે છે.
• % (ટકા)：brightness અને sepia ફંક્શન ઇફેક્ટની તીવ્રતા %માં નક્કી કરે છે; brightnessમાં 100% મૂળ બ્રાઇટનેસ છે અને 120% 20% વધુ બ્રાઇટ કરેલી સ્થિતિ છે.
• deg (ડિગ્રી)：hue-rotate ફંક્શન કલર વ્હીલ પર રંગ ફેરવવાનો કોણ degમાં નક્કી કરે છે; 180deg આપવાથી રંગ વિરુદ્ધ હ્યૂ તરફ જાય છે.

લખવાના ક્રમથી પરિણામ કેમ બદલાય છે

filterમાં ગોઠવેલા ફંક્શન ડાબેથી ક્રમાનુસાર લાગુ પડે છે, અને પાછલી ઇફેક્ટના પરિણામ પર પછીની ઇફેક્ટ લાગુ પડે છે, તેથી ક્રમ બદલાતાં દેખાવ પણ બદલાઈ શકે છે. દાખલા તરીકે, બ્લેક-એન્ડ-વ્હાઇટ કર્યા પછી સેપિયા લગાડવાથી ભૂખરાશ રહી જાય છે, જ્યારે સેપિયા લગાડ્યા પછી બ્લેક-એન્ડ-વ્હાઇટ કરવાથી ભૂખરાશ દૂર થાય છે. આ ટૂલમાં લાગુ પડવાનો ક્રમ નિશ્ચિત છે, પરંતુ બનેલા CSS કોડને ફેરફાર કરીને ક્રમ બદલી શકાય છે.

backdrop-filter થી તફાવત

filter અને backdrop-filter એક જ ફંક્શન વાપરતી પ્રોપર્ટી છે, પરંતુ ઇફેક્ટ કોના પર લાગુ પડે છે તેમાં તફાવત છે.

• filter：filter એ નિર્દિષ્ટ એલિમેન્ટ (ઇમેજ, ટેક્સ્ટ વગેરે) ના પોતાના દેખાવ પર ઇફેક્ટ લગાડતી પ્રોપર્ટી છે.
• backdrop-filter：backdrop-filter એ નિર્દિષ્ટ એલિમેન્ટની પાછળ દેખાતા ભાગ પર ઇફેક્ટ લગાડતી પ્રોપર્ટી છે, જેનો ઉપયોગ ફ્રોસ્ટેડ ગ્લાસ જેવા દેખાવ માટે થાય છે.