색상 혼합기

색상 혼합기란?

색상 혼합기는 두 색 사이를 보간해 중간 색을 알려 주는 무료 온라인 도구입니다. 색 A와 색 B를 HEX로 입력하고(#rrggbb 또는 #rgb 단축 표기 모두 가능), 비율 컨트롤을 0%(완전한 색 A)에서 100%(완전한 색 B)까지 움직인 뒤 색공간을 고릅니다. RGB는 원본 채널을 그대로 섞고, Lab은 지각 공간에서 섞어 중간점이 더 자연스럽게 보이고 칙칙한 회색으로 빠지는 것을 막아 줍니다. 디자이너, 프론트엔드 개발자, 일러스트레이터는 두 브랜드 색의 중간 톤 찾기, 부드러운 2색 그라데이션 만들기, 호버·테두리용 옅은 색 도출, 두 물감이나 그라데이션 정지점이 중간에서 만나는 모습 미리보기 등에 활용합니다. 결과는 큰 견본으로 표시되며 그 아래에 클릭 한 번으로 복사할 수 있는 읽기 전용 HEX 필드가 있습니다.

색상 혼합기 사용법

1. 첫 번째 색을 색상 A (HEX) 입력란에, 두 번째 색을 색상 B (HEX) 입력란에 #rrggbb 또는 #rgb 형식으로 입력하거나 붙여넣습니다.
2. 비율 슬라이더를 끌거나 숫자를 입력해 색 B를 얼마나 섞을지 정합니다. 0%는 색 A, 100%는 색 B, 50%는 정확한 중간점입니다.
3. RGB / Lab 전환으로 혼합 공간을 고릅니다. 지각적으로 더 고른 혼합을 원하면 Lab을, 채널별 단순 평균을 원하면 RGB를 선택하세요.
4. 미리보기 견본이 실시간으로 갱신되는 것을 보면서 그 아래의 혼합 색 HEX 값을 확인합니다.
5. 결과 옆의 복사 버튼을 클릭해 혼합한 HEX를 클립보드에 복사합니다.

예시

A #ff0000, B #0000ff, 비율 50%, RGB

#800080

A #4f86f7, B #ffffff, 비율 75%, RGB

#d3e1fd

자주 묻는 질문

RGB와 Lab 옵션의 차이는 무엇인가요?

RGB는 빨강·초록·파랑 채널을 각각 섞습니다. 빠르고 CSS가 색을 평균 내는 방식과 정확히 일치하지만, 멀리 떨어진 색상끼리는 칙칙한 회색으로 빠질 수 있습니다. Lab은 두 색을 지각 공간인 CIELAB로 변환해 거기서 보간한 뒤 다시 변환하므로, 보통 중간점이 더 밝고 눈이 기대하는 색에 가깝습니다. 둘 다 #rrggbb 결과를 출력합니다.

비율 컨트롤은 무엇을 뜻하나요?

비율은 혼합에서 색 B가 차지하는 양입니다. 0%면 결과가 색 A와 같고, 100%면 색 B와 같으며, 50%면 둘 사이의 정확한 중간점입니다. 슬라이더를 끌거나 정확한 백분율을 입력할 수 있습니다.

어떤 색상 형식을 입력할 수 있나요?

두 입력란 모두 #rrggbb(여섯 자리) 또는 #rgb(세 자리 단축) 형식의 HEX를 받습니다. 둘 중 하나라도 유효한 HEX 색이 아니면 오류 메시지가 나타나고, 둘 다 유효해질 때까지 혼합 결과가 표시되지 않습니다. 출력은 항상 #rrggbb HEX 값입니다.

혼합한 색을 워크스페이스 체인에서 사용할 수 있나요?

네. 결과는 출력 포트로 노출되므로 deftdeck 워크스페이스에서 혼합한 HEX를 다른 도구로 바로 연결할 수 있고, 색·비율·색공간을 바꿀 때마다 자동으로 갱신됩니다.

제 색이 어딘가로 전송되나요?

아니요. 모든 혼합 연산은 브라우저 안에서 로컬로 실행되므로 색 값이 서버로 업로드되지 않습니다. 오프라인에서도 작동하며 팔레트가 비공개로 유지됩니다.