색상 혼합 계산기

색상 A와 B의 선형 보간 결과를 슬라이더로 확인합니다.

브라우저에서 즉시 계산하는 참고용 결과입니다.

색상 A색상 B 혼합 비율

CSS / HEX

가이드

작업 전에 확인할 점

두 UI 색 사이의 중간색을 찾거나 상태 변화 애니메이션에 쓸 단계색을 정할 때 사용합니다. 색상 A와 B를 고르고 슬라이더로 B가 차지하는 비율을 조절합니다.

각 sRGB 채널의 0~255 값을 입력 비율로 선형 보간해 새 RGB와 HEX를 만듭니다. 이는 화면용 수치 혼합이며 물감의 안료 혼합이나 감마 보정 블렌딩을 재현하지 않습니다.

#3366FF와 #FF6655를 50%로 섞으면 두 색의 채널 중간값이 결과로 나옵니다. 결과 HEX를 버튼 hover 색으로 쓴 뒤 실제 배경에서 대비가 충분한지 따로 검사하세요.

같은 50%라도 디자인 도구의 색공간과 혼합 방식에 따라 결과가 달라질 수 있습니다. 인쇄 별색, CMYK, 투명도 합성에는 이 계산값을 그대로 적용하지 마세요.

색상 혼합 계산기의 색상 코드를 어떻게 옮기나요?

결과 아래 복사 버튼으로 CSS, HEX 또는 HSL 텍스트를 복사할 수 있습니다. 붙여 넣은 뒤 대상 디자인 도구가 같은 색 형식을 해석하는지 확인하세요.

색상 혼합 계산기의 화면 색이 인쇄물과 같은가요?

같다고 볼 수 없습니다. 화면의 RGB 발광색과 종이·잉크의 반사색은 색역과 혼합 방식이 다르므로 인쇄 프로필과 교정쇄가 필요합니다.

색상 혼합 계산기 결과를 디자인 토큰으로 바로 확정해도 되나요?

후보로는 쓸 수 있지만 실제 배경, 다크 모드, 상태 변화, 텍스트 대비를 확인한 뒤 이름과 용도를 정해 토큰으로 승인하세요.