Anki에서 글자색을 바꾸고 사용하다가 밝은 모드에서 야간 모드(다크 모드)로 바꾸면 변경한 글자색이 잘 안 보일 때가 있습니다. 이러한 문제의 이유는 밝은 모드에서 지정한 색이 야간 모드(다크 모드) 에서도 그대로 지속되기 때문입니다. 색을 지정하지 않은 것들은 모드를 바꾸면 읽기 편하게 알아서 색이 바뀌는데 내가 직접 지정한 색들은 바뀌지 않습니다. 그렇기 때문에 야간 모드(다크 모드)를 사용한다면 그 모드에서도 보일 색을 직접 따로 지정해줘야 합니다.
야간 모드(다크 모드)에서 색이 안 바뀌는 이유
Anki는 야간 모드를 켜면 카드에 nightMode라는 표시를 붙이고,
그 표시가 붙은 카드의 배경과 기본 글자색을 어두운 쪽으로 덮어씁니다.
기본 노트 유형의 서식에 background-color: white가 적혀 있어도
야간에는 어두워지는 게 이 때문입니다.
그런데 이 덮어쓰기는 카드 전체에만 해당 됩니다. 예를들어 답만 파랗게 칠했다거나 직접 카드 색을 지정한 카드 안의 개별 요소들은 카드 전체 설정보다 더 구체적인 지시라서 모드를 변환해도 색이 변환되지 않고 그대로 유지됩니다. CSS는 늘 더 구체적인 지시를 따르기 때문입니다.
그래서 실제로 겪는 증상은 대개 이렇습니다.
- 배경은 잘 어두워졌는데 파란 답 글씨가 어두워서 안 보인다.
- 회색으로 설정한 예문·주석이 거의 안 보인다
- 노란 형광펜처럼 칠한 배경이 너무 눈부시다
즉 카드 전체는 Anki가 알아서 바꿔 주고 개별 색은 사용자가 정해야 하는 구조입니다.
Anki의 기존 방식
Anki가 기본으로 넣어 주는 빈칸(Cloze) 노트 유형의 서식을 열어 보면 이런 두 줄이 들어 있습니다.
.cloze { color: blue; }
.nightMode .cloze { color: lightblue; }
첫 줄은 평소 색, 둘째 줄은 야간 모드일 때만 쓰는 색입니다. 어두운 배경에서는 파랑이 묻히니까 밝은 하늘색으로 바꿔 두는 것입니다. Anki 개발진이 기본 서식에서 직접 보여 주는 방식이므로, 우리도 똑같이 이렇게 적용시켜주면 됩니다. 즉, 색을 쓰는 요소마다 야간 모드(다크 모드)용 색을 한 세트 더 만들어 주면 됩니다.
ankieditor에서 야간 모드(다크 모드) 색 지정하는 방법
코드를 쓰지 않고 클릭으로 만들 수 있습니다.
- 서식을 가져온 뒤 미리보기 위의 [야간 모드]를 체크합니다. 카드가 Anki 야간 모드와 같은 모습으로 바뀝니다.
- 이 상태에서 색이 묻히는 부분을 클릭합니다. 카드 전체를 바꾸려면 빈 곳을 클릭합니다.
- 왼쪽 패널의 글자 색상이나 배경 색상에서 색을 고릅니다. 여기서 고른 색은 야간 모드에서만 적용되고, 평소 색은 그대로 남습니다.
- 되돌리고 싶으면 색 아래의 [이 대상의 야간 색 지우기]를 누릅니다. 야간 색만 지워지고 평소 색은 유지됩니다.
- 다 됐으면 [코드 복사]로 서식을 복사해 Anki에 붙여 넣습니다.
야간 모드가 켜져 있는 동안에는 색만 바꿀 수 있습니다. 폰트·크기·정렬·줄간격은 선택할 수 없도록 잠깁니다. 이런 값은 낮과 밤이 달라야 할 이유가 없고, 야간에만 따로 지정해 두면 나중에 평소 크기를 바꿨을 때 야간만 옛날 값으로 남아 어긋나기 때문입니다. 크기나 정렬은 야간 모드를 끄고 바꾸면 양쪽에 함께 적용됩니다.
CSS로 직접 수정하는 방법
ankieditor가 서식의 스타일 영역에 써 넣는 규칙은 이런 모양입니다.
.card.nightMode { background-color: #2f2f31; }
.nightMode .answer { color: #7fb2ff; }
카드 전체는 .card.nightMode, 카드 안의 요소는 .nightMode 뒤에
해당 요소를 적는 형태입니다. Anki 매뉴얼이 안내하는 두 가지 형태 그대로이고,
데스크톱·AnkiDroid·AnkiMobile 모두 같은 표시를 쓰기 때문에 어느 기기에서나 동작합니다. 직접
손으로 쓰고 싶다면 이 코드를 그대로 서식에 붙여 넣어도 됩니다.만약 변경할 부분이 있다면 직접
수치를 조정해도 됩니다.
야간 모드(다크 모드)에 적절한 색
어두운 배경에서는 같은 계열의 밝은 쪽으로 옮기는 게 기본입니다. 색상 자체를 바꾸면 카드 인상이 달라져 오히려 헷갈립니다.
- 파랑 → 하늘색 (
#1e6fd9→#7fb2ff) - 답이나 빈칸 강조에 가장 흔한 조합입니다. - 빨강 → 살구·연분홍
(
#c0392b→#ff9b8a) - 오답 표시나 주의 문구에 씁니다. - 진회색 → 연회색 (
#666666→#aaaaaa) - 예문·출처처럼 본문보다 약하게 두는 글에 씁니다. - 형광 배경 → 어두운 배경 + 밝은 글자 - 노란 배경에 검은 글씨를 그대로 두면 야간에 너무 튑니다. 배경을 짙은 갈색 계열로 낮추고 글자를 밝게 하는 편이 눈이 편합니다.
완전한 흰색(#ffffff)은 피하는 게 좋습니다. 어두운 배경에서 대비가 너무 세면
글자가 번져 보여 장시간 복습에 피로합니다. 아주 밝은 회색
(#e8e8e8 정도)이 더 편합니다.
노트 유형마다 배경색을 달리 하는 방법
글자 색 말고 배경색 자체를 바꾸고 싶은 경우도 있습니다. 영어 단어, 전공 용어, 상식처럼 여러 종류의 카드를 섞어 복습하다 보면 카드 겉모습이 전부 똑같아서 지금 무슨 공부를 하고 있는지 구분하기 쉽지 않습니다. 영어 카드는 흰색 그대로, 전공 카드는 파란색, 상식 카드는 붉은색 - 이 정도 차이만 있어도 카드가 뜨는 순간 바로 어느 유형의 카드인지 알아차릴 수 있습니다.
바꾸는 방법은 간단합니다. 카드의 빈 곳을 클릭해서 카드 전체를 선택하고, "글자 서식"의 배경 색상에서 색을 고르면 됩니다. 색은 꼭 연한 톤으로 고르세요. 진한 색은 글자와의 대비를 깎아서 구분이 잘 되지 않습니다. 미리보기로 글자가 여전히 잘 읽히는지 확인하면서 고르는 게 제일 좋습니다.
여기서 오해하기 쉬운 게 하나 있습니다. "덱마다 색을 다르게" 주고 싶어도 그렇게는 안 됩니다. Anki의 서식은 덱이 아니라 노트 유형 단위로 적용되기 때문입니다. 과목마다 노트 유형을 나눠 쓰고 있다면 의도대로 되지만, 하나의 노트 유형을 여러 과목에 함께 쓰고 있다면 그 카드들이 전부 같은 색이 됩니다. 때문에 과목별로 서식을 달리 하고 싶다면 과목별로 새로운 노트 유형을 새로 만들어야 합니다.
또한 주의해야 할 점이 있습니다. 이렇게 방금 지정한 배경색은 사실 야간
모드에서 사라집니다. 야간이 되면 Anki가 배경색을 다시 어둡게 바꾸는데, 이 규칙이
노트 유형의 .card 배경 설정을 이기기 때문입니다. 앞서 이 글에서 설명한 것과
똑같은 규칙입니다. 그러니 주로 야간에 공부하면서도 노트 유형을 구분하고 싶다면, 위에서 배운
방법대로 야간 전용 배경색을 따로 지정하거나, 배경색 대신 글자 색이나
구분선으로 구분하는 편이 낫습니다.
주의할 점
기기마다 배경색이 조금씩 다릅니다. Anki는 야간 배경색을 서식에 고정해 두지 않고 앱이 정하도록 두었습니다. 데스크톱과 모바일의 어두운 배경 톤이 미묘하게 다를 수 있다는 뜻입니다. 그래서 배경에 맞는 색은 한 기기에서만 잘 보일 수 있습니다. 여유 있는 밝기 차이를 두세요.
구분선 색은 야간에도 바뀌지 않습니다. 구분선에 준 색은 카드 전체 설정이 아니라 개별 요소 색이므로 야간 모드가 건드리지 않습니다. 아주 연한 회색 선을 골랐다면 어두운 배경에서는 사라져 보입니다. 구분선도 야간 색을 따로 지정하거나, 처음부터 중간 톤으로 고르는 편이 안전합니다.
노트 유형마다 따로 정해야 합니다. 서식은 노트 유형 단위로 저장되므로 여러 노트 유형을 쓴다면 각각 수정해야 합니다.
자주 묻는 질문
Anki 야간 모드는 색이 자동으로 바뀌지 않나요?
일부는 맞고 일부는 틀립니다 전체 배경색은 바뀌지만 지정한 것들은 바뀌지 않습니다. 카드 배경과 기본 글자색만 어두운 쪽으로 바꾸고, 서식에서 직접 지정한 색은 그대로 둡니다. 자동 반전을 하면 의도해서 고른 색까지 망가지기 때문에 일부러 이렇게 작동합니다. 개별 색은 야간용을 따로 지정해야 합니다.
야간 모드에서 정한 색이 평소 색까지 바꾸나요?
바꾸지 않습니다. 야간용 색은 별도의 규칙으로 기록되어 야간 모드일 때만 적용됩니다. 평소 색은 그대로 남아 있고, ankieditor에서 야간 모드를 끄면 원래 색으로 돌아온 화면을 바로 확인할 수 있습니다.
배경은 안 바꿨는데 카드가 흰색 그대로예요.
서식에 야간 전용 배경색이 이미 지정돼 있을 가능성이 큽니다. 야간 모드를 켜 둔 채로 카드 빈 곳을 클릭하고 [이 대상의 야간 색 지우기]를 누르면 Anki 기본 야간 배경으로 돌아갑니다.
야간 모드에서 구분선이 안 보이는 문제는 Anki 앞면 뒷면 구분선 굵게 만들기에서 색 고르는 요령과 함께 다룹니다. 카드 배경색 자체를 바꾸는 방법은 노트 유형마다 배경색을 다르게 주고 싶다면을 참고하세요.