accent-color로 못생긴 checkbox 커스텀하기

보통 input을 꾸미려면 label을 쓰라고 한다. label, ::before, ::after 등등 나도 자주 썼지만 쓸때마다 너무 복잡하다.

그래서 요즘은 최대한 간단하게 css의 accent-color를 사용하여 강조색을 변경해 주는 방법을 사용하고 있다.

못생긴 파란색을 쓰는 기본 체크박스

accent-color: #333

 

아래 링크에서 예시를 보면 checkbox 외 range input, process 등등 여러가지에 적용 가능하다.

https://www.w3schools.com/cssref/tryit.php?filename=trycss4_accent-color

W3Schools online HTML editor