개인 블로그 다크모드 적용하기

개인 블로그 다크모드 적용하기

안녕하세요 TriplexLab 입니다 :)
오늘은 티스토리 개인 블로그에 다크모드를 적용하는 방법에 대해서 알아 보도록 하겠습니다.

// 다크 모드인 경우
@media (prefers-color-scheme: dark) {
	body {
		background-color: #1e1f21 !important;
		color: #fff !important;
	}
    .cover-masonry ul li a {
		color: #fff !important;
	}
	.cover-masonry ul li .excerpt {
		color: #fff !important;
	}
}

위 코드는 css 상에서 운영체제가 선호하는 색상 테마가 다크모드인지 감지해서 다크모드 일때만 해당 코드를 실행해주는 것 입니다.

 

저는 개인적으로 이렇게 작업을 해놨습니다~.

개인 블로그 다크모드 적용