おかえりなさい

色相環で隣り合う3色（色相差30度）で、同じ明度と彩度を持つ組み合わせ。まとまりのある、穏やかな印象を与えます。

それぞれの配色は独自の雰囲気を持っています。配色ハーモニーを参考に、効果的な色の組み合わせを見つけましょう。

色相環で正反対に位置する色（色相差180度）の組み合わせ。高いコントラストが生まれます。

色変換、色の組み合わせ、色覚シミュレーションなど、カラーコード「123456」に関する詳細情報を提供します。

HTMLカラーピッカー: 123456

同じ色相で、明度を±50%変化させた3色の組み合わせ。繊細で洗練された印象を与えます。

ベースとなる色と、その補色の両隣に位置する2色（補色から±30度）の組み合わせ。補色配色のような大胆さを持ちながら、より多様な表現が可能です。

色相環で60度ずつ離れた2組の補色を組み合わせた配色です。

色相環で120度ずつ均等な間隔で配置された3色の組み合わせ。1色をメインカラーとし、他の2色をアクセントとして使うのが効果的です。

このセクションでは、選択した色を基準に、純粋な白と黒をそれぞれ10%ずつ加えたティント（明色）とシェード（暗色）を正確に生成します。

名前

お問い合わせ

テキストと背景色のカラーピッカーで色を選択するか、16進数のRGB形式（例: #259, #2596BE）で色を入力してください。スライダーで色を調整することも可能です。ウェブコンテンツ・アクセシビリティ・ガイドライン（WCAG）では、テキストの可読性を判断するための基準が定められています。この基準は、色の組み合わせを特定のアルゴリズムで評価し、コントラスト比を算出します。WCAGによると、通常のテキスト（本文）では4.5:1以上、大きなテキスト（18pt以上、または14pt以上の太字）では3:1以上のコントラスト比が推奨されています。

カラーコントラストチェッカー：このオンラインツールで、カラーコード「123456」のテキストと背景色のコントラスト比に関する詳細を確認できます。

カラーコントラストチェッカー: 123456

注意

この機能を使用するには、無料のimagecolorpickerアカウントを作成する必要があります。登録後、さらに多くの機能にアクセスできるようになります。

新しいパレットを作成

パレットを編集

imagecolorpicker.comのグラデーションメーカーで、魅力的なグラデーションを作成しましょう。線形・円形グラデーションの選択、複数の色の追加、角度の調整、そして作品の保存・共有が可能です。CSSコードを直接ダウンロードして、あなたのプロジェクトにシームレスに統合できます。

グラデーションを編集

グラデーションのタイトルは必須です。

グラデーションメーカー - 美しい線形・円形グラデーションを作成 | imagecolorpicker.com

グラデーション

カラーコード、バリエーション、配色を生成し、コントラスト比をチェックします。

カラーコード生成＆スポイト

美しいグラデーションを簡単に作成 - 色や方向をカスタマイズして、作品をエクスポートしましょう。

グラデーションメーカー

お気に入りのカラーパレットを管理・整理できます。

保存したパレット

この共有されたグラデーションを表示・探索します。

共有されたグラデーション

この共有されたパレットを表示・探索します。

共有されたパレット

広告ブロッカーの使用が検出されました。問題ありません。このツールを多くのユーザーに無料で提供し続けるため、少額の寄付でご支援いただけますと幸いです。皆様からのご支援が、サービスの維持・改善につながります。

広告ブロッカーが検出されました！

上のオンライン画像スポイトを使って色を選択し、そのピクセルのHTMLカラーコードを取得します。HEX、RGB、HSVの値も同時に取得できます。「画像を使用する」セクションでは、ご自身の画像（デスクトップのスクリーンショットなど）をアップロードしたり、クリップボードから画像を貼り付けたり、テキストボックスに画像のURLを入力したりできます。ウェブサイトのURLを使用すると、左側にサムネイルが表示されます。

スポイト：このオンラインツールを使えば、画像をアップロードしたり、ウェブサイトのURLを指定するだけで、RGB、HEX、HSLのカラーコードを取得できます。👍

オンラインスポイト👍｜HEXスポイト｜HTMLスポイト

最新のOSとブラウザを搭載したMacまたはPCであれば、この機能を利用できます。Safari、Edge、Firefox、Chromeでテスト済みです。表示は若干異なる場合があります。

この機能は3回まで無料で利用でき、その後は短い広告を視聴することでさらに3回利用できます。皆様のご支援が、世界中の300万人以上のユーザーにこのツールを無料で提供し続ける力となります。

無料で続けるには、15秒の広告をご覧ください。

この機能は3回使用されました。

私たちのスポイトツールはまだ始まったばかりです。今後さらに多くの機能が追加される予定ですので、ご期待ください。

アカウントをお持ちでないですか？ 新規登録

メールアドレスを入力してください。ログイン用の安全なリンクを送信します。

パレットのタイトルは必須です。

まだカラーパレットが保存されていません。パレットを保存すると、ここに表示されます。

共有されたカラーパレットは存在しないか、作成者によって削除された可能性があります。このリンクの送信元にお問い合わせください。

パレット

タイトルは必須です

このウェブサイトは広告収入によって運営されています。広告ブロッカーが有効になっているようです。広告を非表示にしたいお気持ちは理解できますが、サイトの運営・維持には費用がかかります。皆様からの温かいご支援（コーヒー1杯）が大きな力になります！

画像、ウェブサイト、画面から色を選択するオンラインツール。HEX、RGB、HSLカラーコードを即座に取得します。

画像やウェブサイトからカラーコード（HEX、RGB）を抽出するオンラインツール。100%無料。

ImageColorPicker.com

カラーコード生成＆スポイト

色変換

#a100ff

バリエーション

シェード

ティント

色の組み合わせ

補色

スプリットコンプリメンタリー（分裂補色）

トライアド（3色配色）

類似色

モノクロマティック（単色）

テトラード（4色配色）

カラーコントラストチェッカー

テキストの色

背景色

コントラスト