ツール ガイド
design 無料 サインアップ不要

タイムゾーン変換

色温度をケルビンからRGBおよびHEXカラー値に変換できます。

ツールを読み込み中…

このツールについて

1000Kから40000KのKelvin値を入力すると、対応するRGBとHEXカラーが即座に表示され、ろうそくの炎や昼光などの実世界の照明例も確認できます。視覚的なスペクトルグラデーションと、写真撮影、照明デザイン、ディスプレイキャリブレーションのための実用的なユースケースガイダンスが含まれています。

使い方

  1. 1 ステップ1:1000〜40000の間のKelvin値を入力するか、スライダーをドラッグしてください。
  2. 2 ステップ2:結果のRGB値、HEXコード、カラープレビュースウォッチを確認してください。
  3. 3 ステップ3:プリセット(ろうそく、昼光など)をクリックして一般的な温度にジャンプしてください。
  4. 4 ステップ4:オプションでHEXまたはRGBカラーを入力して、同等の色温度を推定してください。

What "color temperature" really measures

Color temperature describes the color of light using the Kelvin (K) scale, borrowed from physics. Imagine heating a theoretical black object: as it gets hotter it glows red, then orange, then white, then bluish. The temperature at which the glow matches a given light is that light's color temperature. The counter-intuitive part is that lower Kelvin numbers look warmer (orange, like a candle at 1800K) and higher numbers look cooler (blue, like an overcast sky at 6500K). Everyday speech has it backwards — "warm" light is physically the cooler temperature.

This tool converts a Kelvin value into the on-screen RGB color that light produces, and can also estimate the Kelvin temperature of a color you already have. It runs entirely in your browser, so nothing you type is uploaded.

How the conversion works

Behind the slider is Tanner Helland's well-known approximation of black-body radiation. The algorithm divides the Kelvin value by 100 and then computes each channel separately. Below about 6600K the red channel is pinned at 255 (fully on) while green and blue are derived from logarithmic and power curves; above that point red and green fall off while blue saturates. The result is clamped to the 0–255 range and rounded, giving you a hex and RGB value you can paste straight into design software.

The reverse estimate uses a binary search: it repeatedly generates the RGB for a candidate Kelvin value, measures how far that is from your input color in RGB space, and narrows the range guided by the red-to-blue ratio. Because real screen colors rarely sit exactly on the black-body curve, the estimate is an approximation — a desaturated bluish gray will read as a high Kelvin, a warm beige as a low one.

A worked example

Type 3000 into the Kelvin field. The tool returns roughly #FFB16E, an rgb(255, 177, 110) amber — the signature glow of a warm-white LED bulb. Now drag the slider to 6500 and the swatch shifts to a near-neutral #FFFAFE, the white point of an overcast sky and the basis of the sRGB display standard (D65, technically 6504K). Push it to 10000 and the color turns visibly blue, matching a clear north-facing sky. The preset buttons (Candle, Incandescent, Daylight, Blue Sky) jump to these landmark values instantly.

Practical use cases

  • Photography white balance. Match your camera's Kelvin setting to the scene. Noon daylight and most studio flashes sit near 5500K; shooting under tungsten bulbs (about 2700–3200K) without correcting will make images look orange.
  • Choosing light bulbs. Bulb packaging lists a Kelvin figure. Use 2700–3000K for living rooms and bedrooms where you want a cozy feel, and 4000–5000K for kitchens, garages, and offices where you want alert, neutral light.
  • Display and print calibration. Monitors target D65 (6504K) for sRGB work, while print proofing booths use D50 (5003K) so prints viewed under standardized light match the screen.
  • Web and UI design. Generate a believable "warm lamp" or "cool moonlight" tint for backgrounds, overlays, and CSS gradients without guessing hex codes.

Tips for accurate results

  • Use the spectrum strip as a sanity check. The gradient runs from 1000K to 10000K so you can see at a glance whether a value lands in the warm, neutral, or cool zone before committing.
  • Remember screens can only approximate light. A monitor emits its own light, so a 2000K swatch shown on a 6500K-calibrated display is a representation, not the actual photon mix a bulb produces. It is excellent for color picking, not for scientific measurement.
  • Pair color temperature with brightness. The same 3000K looks different dimmed versus full. Kelvin sets the hue; it does not set intensity.

Common mistakes

  • Assuming higher Kelvin means warmer. It is the opposite. If a room feels too clinical, you need a lower Kelvin bulb, not a higher one.
  • Mixing color temperatures in one space. Combining 2700K and 5000K fixtures in the same room produces a patchy, uneven look. Pick one target and stick to it.
  • Confusing color temperature with CRI. Kelvin describes the tint of the light; the Color Rendering Index describes how faithfully that light reveals object colors. A bulb can have a pleasant 3000K and still render reds poorly if its CRI is low — they are independent qualities.
  • Reading too much into the reverse estimate for vivid colors. Highly saturated greens, purples, or pinks lie far off the black-body curve, so the Kelvin estimate for them is only a rough nearest match, not a meaningful temperature.

よくある質問

{# Alpine.js — self-hosted. (The previous jsdelivr CDN tag had a stale SRI integrity hash, so the browser refused to run it and window.Alpine was never defined — silently breaking every FAQ accordion and Alpine tool.) #}