Can I keep one color while changing the others?

Yes. Lock any current swatch, then regenerate. A locked swatch remains in the same position until it is unlocked or the tool is reset.

Why can a suggested text color still be unsuitable?

The ratio covers pure black or white against one opaque background. Real typography, gradients, opacity, images, focus states, and neighboring colors require testing in context.

Are the HSL values exact?

They are a rounded representation derived from the generated sRGB value. Use the displayed HEX or RGB value when an exact interchange value matters.

Does the tool upload my palette?

No. Generation, locking, conversion, and contrast calculation happen in the browser. A file leaves the browser only when you choose where to save or share it.

← 홈

Browser-local color tool

랜덤 색상 및 팔레트 생성기

작은 팔레트를 만들고, 마음에 드는 색상을 잠그고, 흑백 텍스트 대비를 비교한 다음 정확한 값을 복사하거나 JSON로 내보내세요.

팔레트 제어

색상스타일

이 브라우저에서 Web Crypto를 사용합니다. 잠긴 색상은 그대로 유지됩니다. 스타일 모드는 HSL 범위를 제한하며 색상 조화를 보장하지 않습니다.

크기와 스타일을 선택한 후 팔레트를 생성하세요.

명암비는 불투명 sRGB 색상만 비교합니다. 전체 인터페이스를 인증하거나 글꼴 크기, 굵기, 투명도, 그라데이션, 이미지 등을 고려하지 않습니다. 팔레트 값은 이 구성 요소에 남아 URL이나 저장소에 추가되지 않습니다. 일반 사이트 분석은 이 값을 받지 못한 채 로드될 수 있습니다.

노선 위치: ko

How the palette is generated

Each unlocked slot is drawn in this browser from Web Crypto. Full-spectrum mode samples a 24-bit sRGB value. Pastel, vibrant, dark, and light modes sample bounded hue, saturation, and lightness ranges before converting the result to sRGB; grayscale mode uses one shared channel value.

The generator rejects duplicate colors within one palette and keeps every locked slot unchanged. It reports HEX, RGB, and HSL representations of the same opaque color, then calculates contrast against pure black and pure white from relative luminance.

Worked example: build a five-color draft

Choose five colors and Vibrant, generate once, then lock the two colors that suit the project. Regenerate the unlocked slots until the set has useful variety. Copy the CSS variables for a prototype, but test the actual foreground, font, size, states, transparency, and background combinations before treating any pair as accessible.

Useful ways to apply it

Draft a small visual direction before refining a design system.
Create distinct chart, classroom, or game tokens that can be copied exactly.
Compare black and white text as a first contrast check for an opaque swatch.

Limits and checks

Style modes constrain HSL ranges; they do not guarantee harmony, brand fit, or perceptual distance.
A black-or-white ratio for one opaque sRGB swatch does not certify a component or a whole interface against WCAG.
These random values are design inputs, not passwords, cryptographic keys, or proof of uniqueness outside the current palette.

What stays local

Palette values and locks stay in component memory and are not added to the URL or browser storage. Copy and download actions create local clipboard or file output only. Normal site analytics may load, but the palette values are not sent as analytics fields.

Random palette questions

Can I keep one color while changing the others?: Yes. Lock any current swatch, then regenerate. A locked swatch remains in the same position until it is unlocked or the tool is reset.
Why can a suggested text color still be unsuitable?: The ratio covers pure black or white against one opaque background. Real typography, gradients, opacity, images, focus states, and neighboring colors require testing in context.
Are the HSL values exact?: They are a rounded representation derived from the generated sRGB value. Use the displayed HEX or RGB value when an exact interchange value matters.
Does the tool upload my palette?: No. Generation, locking, conversion, and contrast calculation happen in the browser. A file leaves the browser only when you choose where to save or share it.

Related decisions

Reviewed for functionality and English content on 2026-08-22.