CSS Reference
HTML
JavaScript
Development
highlight_alt
Selector
work_outline
Properties
settings
Functions
rule
Rules
category
Types
straighten
Units
article
Documents
manage_search
Indexing
search
검색
Functions
Functions
Auto Box Sizing
fit-content()
Color
color()
hsl()
hsla()
hwb()
lab()
lch()
oklab()
oklch()
rgb()
rgba()
Custom Properties for Cascading Variables
var()
Easing Functions
cubic-bezier()
steps()
Environment Variables
env()
Filter Effects
blur()
brightness()
contrast()
drop-shadow()
grayscale()
hue-rotate()
invert()
opacity()
saturate()
sepia()
Grid Layout
minmax()
repeat()
Image
conic-gradient()
cross-fade()
element()
image-set()
linear-gradient()
radial-gradient()
repeating-conic-gradient()
repeating-linear-gradient()
repeating-radial-gradient()
List and Counter
counter()
counters()
Shapes
circle()
ellipse()
inset()
path()
polygon()
rect()
Transform
matrix()
matrix3d()
perspective()
rotate()
rotate3d()
rotateX()
rotateY()
rotateZ()
scale()
scale3d()
scaleX()
scaleY()
scaleZ()
skew()
skewX()
skewY()
translate()
translate3d()
translateX()
translateY()
translateZ()
Values and Units
acos()
asin()
atan()
atan2()
attr()
calc()
clamp()
cos()
max()
min()
sin()
tan()
url()
Filter Effects
개요
CSS Filter Effects Module Level 1 사양에서 이미지에 그래픽 효과를 주기 위한 다양한 함수들을 정의했다.
관련 함수
blur()
가우시안 블러(gaussian blur)를 적용하여 이미지를 흐리게 처리한다.
brightness()
이미지의 밝기를 조절한다.
contrast()
이미지의 색상 대비를 조절한다.
drop-shadow()
그림자를 생성한다.
grayscale()
이미지를 흑백으로 변환한다.
hue-rotate()
이미지의 전체 색조를 조절한다.
invert()
이미지의 색상을 반전한다.
opacity()
이미지의 투명도를 조절한다.
saturate()
이미지의 채도를 조절한다.
sepia()
이미지에 세피아 톤을 적용한다.
W3C Modules
Filter Effects Module Level 1
W3C Working Draft, 18 December 2018