01
知覚色空間
より予測可能な色調整とデザイン全体のより良い視覚的一貫性のためにOKLCHの知覚的均一色空間で作業。
Free browser-based OKLCH toolkit
OKLCHカラーツールセット
モダンなOKLCH色空間用のプロフェッショナルカラーピッカー・変換器。HEX、RGB、HSL、LAB、OKLCH間の変換に対応し、リアルタイムプレビューと色域チェック機能付き。
Runs entirely in your browser
Copy-ready CSS output
Free to use, no signup
01
Pick and convert colors
Tune OKLCH, then copy HEX, RGB, HSL, LAB, or native OKLCH syntax without leaving the page.
02
Validate contrast early
Check foreground and background pairs before they become UI problems in production.
03
Check gamut and browser support
Understand sRGB, P3, Rec2020, and modern CSS Color 4 support before you ship.
Supported in Chrome 111+, Safari 15.4+, and Firefox 113+
Core Capabilities
強力な機能
モダンなカラーワークフロー用に設計された包括的なツール
Start with direct manipulation, then validate palettes, contrast, gamut, and browser support as the decision becomes production-facing.
02
リアルタイム色変換
色を調整しながらOKLCH、HEX、RGB、HSL、その他の形式間の瞬時の変換を確認。遅延なし、推測なし。
03
スマートパレット生成
OKLCHの数学的精度を使用して調和のとれたカラーパレットを生成。完璧な補色、類似色、三角色配色を作成。
04
アクセシビリティファーストデザイン
内蔵のWCAGコントラストチェックと色覚異常シミュレーションで、色がすべての人に機能することを確保し、包括的なデザインを簡単に。
05
コピー対応CSSコード
モダンOKLCH構文、CSSカスタムプロパティ、最大ブラウザ互換性のためのフォールバック値を持つ本番対応CSSを取得。
06
デザインツール統合
Figma、Sketch、Adobe Creative Suite、人気のデザインシステムに色とパレットをワンクリック互換性で直接エクスポート。
Need To Know
よくある質問
OKLCHカラーピッカー・変換器に関するよくある質問
These are the questions most visitors ask before they trust a new color workflow with production UI work.