사용 방법: 색상 혼합기

설명

Blend two colours in sRGB, HSL or perceptual CIE Lab and generate a ramp with contrast ratios.

• 색상 도구
• 모든 연산이 클라이언트에서 수행되어 API 키, 토큰 등 민감한 데이터에도 안전합니다.

사용 방법

색상 혼합기 사용법은 세 단계:

1. 입력창에 데이터를 붙여넣기 (또는 예제 불러오기).
2. 목적에 맞게 옵션 조정.
3. 출력 복사·다운로드·확인 — 입력에 따라 실시간 업데이트.

실행

예제

Mix against #ffffff at 50% and switch the space to CIE Lab for a perceptually even ramp.

입력

#0ea5b7

출력

#0ea5b7 + #ffffff at 50% (mixed in RGB)

Result
  HEX   #87d2db
  RGB   rgb(135, 210, 219)
  HSL   hsl(186.4, 54.0%, 69.3%)

Contrast against white : 1.71:1
Contrast against black : 12.26:1

Ramp (9 steps)
    0%  #0ea5b7
   13%  #2cb0c0
   25%  #4abcc9
   38%  #68c7d2
   50%  #87d2db
   63%  #a5dde4
   75%  #c3e9ed
   88%  #e1f4f6
  100%  #ffffff

CSS
  --mix: #87d2db;
  background: linear-gradient(90deg, #0ea5b7, #ffffff);

此输出由工具真实运行产生，并非人工编写。

사용 사례

색상 혼합기이 유용한 상황:

• Blend two colours in sRGB, HSL or perceptual CIE Lab and generate a ramp with contrast ratios.

매개변수

이 도구에는 옵션이 없으며 입력에만 작용합니다.

FAQ

주의 사항

• 全部计算在浏览器端完成，因此超大输入受限于标签页内存，而非服务器上传限制。

관련 도구

색상 혼합기 → · 색상 도구 →