색 코드 #FAA832, 무슨 뜻일까요?

0과 1 네 개면, 한 글자로 줄어요

지난 시간에 0과 1을 배웠죠.
그런데 0과 1만 길게 늘어놓으면
사람 눈엔 너무 길고 헷갈려요.
그래서 네 개씩 묶어서
한 글자로 줄이기로 했어요.
비트 네 개로 만들 수 있는 건
0부터 15까지,
딱 열여섯 가지예요.

0부터 15까지, 열여섯 가지가 한 글자로 표현돼요.

그런데 문제가 하나 있어요.
10, 11, 12처럼 두 자리가 되면
그게 한 글자인지 두 글자인지
헷갈리잖아요.
그래서 영리한 약속을 했어요.

9 다음은 A예요

우리가 쓰는 숫자는
9까지밖에 없어요.
그런데 16진수는 한 글자로
열다섯까지 나타내야 하죠.
모자란 여섯 개는 어떻게 할까요?
그냥 알파벳을 빌려왔어요.
9 다음은 A,
그다음은 B,
이렇게 F까지요.

숫자 열 개에 알파벳 여섯 개를 더해, 한 글자로 열여섯 가지.

그러니까 A는 열,
F는 열다섯이에요.
무서운 암호가 아니라,
그냥 숫자가 모자라서
빌려온 알파벳이었던 거죠.

색은 빛 세 개를 섞은 거예요

이제 화면의 색으로 가볼게요.
화면 속 모든 색은
빨강·초록·파랑
세 가지 빛을 섞어 만들어요.
각각을 얼마나 세게 켜느냐로
색이 정해지죠.
세 슬라이더를 직접 움직여서
색이 어떻게 변하는지 보세요.

다 끄면 까만색, 다 세게 켜면 흰색이에요.

세 빛을 0부터 255까지 조절하면
천육백만 가지가 넘는 색이 나와요.
그런데 위에 뜨는 코드,
어딘가 익숙하지 않나요?

#FAA832를 세 토막으로 잘라요

색 코드는 사실
빨강·초록·파랑 세 값을
16진수로 적어,
나란히 붙여둔 것뿐이에요.
여섯 글자를 두 개씩 자르면
세 토막이 나오죠.
앞 두 글자가 빨강,
가운데가 초록,
끝이 파랑이에요.

두 글자씩 잘라서 읽기.

F는 15, A는 10이라고 했죠.
그래서 FA는
16 곱하기 15 더하기 10,
즉 250이에요.
이렇게 읽으면 #FAA832는
빨강 250, 초록 168, 파랑 50이라는 뜻이에요.
바로 이 따뜻한 노란색이죠.

이제 코드가 읽혀요

한번 익히면
코드만 보고도
대충 무슨 색인지 감이 와요.
아래 색들을 보세요.
빨강 자리가 크면 붉고,
세 값이 다 크면 밝아요.
더 이상 암호가 아니죠.

세 값이 모두 크면 밝고, 한 색만 크면 그 색이 진해져요.