블러 효과: filter: blur(값);
값 이 클수록 흐려지는데, 단위는 px을 쓰고, %는 허용되지 않는다
블러 효과: filter: blur(값);
값 이 클수록 흐려지는데, 단위는 px을 쓰고, %는 허용되지 않는다
명도: filter: brightness(값);
값 에는 %(나 소수점 단위)를 쓰는데 0% 는 완전히 검게 되며, 100% (= 원본)를 넘으면 더 밝아진다 - 따라서, 100% 이하는 원본의 밝기를 낮춘다
채도: filter: saturate(값);
값 에는 %(나 소수점 단위)를 쓰는데 0% 는 완전한 무채색이 되며, 100% (= 원본)를 넘으면 더 채도가 높아진다 - 따라서, 100% 이하 값은 원본의 채도를 낮춘다
색상 대비: filter: contrast(값);
0% 는 완전한 회색조이고, 100% 는 원본과 같으며, 그 이상으로 주면 대비가 더 뚜렷해진다
그레이스케일 회색조: filter: grayscale(값);
값 에는 %(나 소수점 단위)를 써서 전환 비율을 지정해주는데 0% (원본 이미지), 100%(완전한 회색조 이미지), 그 사이의 값 은 회색톤 비율을 지정한다
세피아톤 갈색조: filter: sepia(값);
값 에는 %(나 소수점 단위)를 써서 전환 비율을 지정해주는데 0% (원본 이미지), 100% (완전한 갈색조 이미지), 그 사이의 값 은 세피아톤 비율을 지정한다
색조 회전: filter: hue-rotate(각도값);
주어진 이미지에 hsl 색상환을 적용하는데, 각도값 은 입력 샘플을 조절할 색상환 각도로서
0deg (원본 이미지) ~ 360deg 이다
색상 반전: filter: invert(값);
값 에는 %(나 소수점 단위)를 쓸 수 있는데, 0 (원본 이미지) ~ 1 (정반대 색상으로 반전)까지의 값이 들어간다
불투명도: filter: opacity(값);
주어진 이미지의 불투명도를 설정하는데, 보다 확립된 Css의 opacity 속성과 같은 방식으로 작동한다!