色彩スタジオ
色彩スタジオのツールをすべてここに。
パレット、CSS、コントラスト。
無料ツール7個登録不要どの端末でも動くファイルは手元に残る
下の色彩スタジオをめぐって、目的に合うツールを見つけてください。
色彩スタジオのツール一覧
ツール0個 · 7個を予定やりたいことごとに分類しています。現在は0が公開中で、残りは開発中のため「近日公開」と表示しています。
色とCSS
スタイルシートにそのまま貼れる値。ツール7個カラーコード変換近日公開1つの色をすべての表記で同時に表示し、WCAGのコントラストも確認できます。HEX · RGB · HSLカラーパレット生成近日公開基準色から配色、明るさ違い、濃さ違いを作り、HEXコードをすぐコピーできます。HEXCSSグラデーション生成近日公開線形と放射状のグラデーションを、プレビューを見ながら作り、CSSをそのまま貼れます。CSSbox-shadow生成近日公開オフセット、ぼかし、広がり、色を、実際のカード上で見ながら調整します。CSSコントラスト比チェック近日公開2色の比率と、AAとAAAに通るかどうかの明確な答え。WCAGTailwind色検索近日公開任意のHEX値にいちばん近いTailwindクラスを、判断できるよう差の大きさとあわせて示します。HEX色覚シミュレーター近日公開赤と緑に頼る前に、男性の約8%に見えている状態でデザインを確認します。JPG · PNG
色ツールについて
コントラストの基準は何を使っていますか？
WCAG 2.2の相対輝度です。監査担当者やブラウザの開発者ツールと同じ計算式を使っています。本文には4.5:1、大きな文字とUIの境界には3:1が目安です。
作ったパレットが印刷すると違って見えるのはなぜですか？
画面は加法混色、インクは減法混色です。画面上の鮮やかな色には、対応するインクが存在しないことがよくあります。CMYKの値は一致する色ではなく、校正の出発点として扱ってください。
ほかの生息地
みなさんのおかげで、
ToolZoolは無料のまま
優れたツールは、誰にとっても無料であるべきです。その費用をどう賄っているのか、隠さず全部書きます。
Zoolyにコーヒーをおごる灯りをともし、新しいツールを生み出すための直接の支援。まったくの任意です。Zoolyを支援する →
おすすめの品ブラウザでは終わらない仕事を片づける有料ツール。あのページから、いまこちらが得るものはありません。おすすめを見る →
礼儀をわきまえた広告広告と明示した枠は作業領域の外に置くので、操作と結果のあいだに割り込むことはありません。広告方針を読む →
あなたは最高です訪問も、共有も、温かいひと言も、ToolZoolが育って多くの人に届く助けになります。
