自分の作業の際に、次のような使い方をするために作成したもの。
【 イラストをPhotoshopやIllustratorなどを使って作成する際の色見本として、ブラウザでカラーサンプルのページを表示しておいて、必要に応じてスポイトツールで色を抽出するためのカラーテーブルとして使用 】
PhotoshopやIllustratorなどで、デスクトップ上から、すばやく色を抽出する方法はこちら
❖ カラーサンプル（渋め）
彩度をおさえたやや渋めのトーン50色。
ColorUtils.jsを使い、Illustratorのブレンドツールのような感じで、2色のコード（16進数）間を10段階に分け、コードとともにボックスの背景色として、コードの色を表示させ、それを5つ重ねて50色にしている。
❖ カラーサンプルジェネレータもどき（１）
表示させたい色を2つ入力し、[作成]ボタンをクリック。カラーサンプル（渋め１）と同様の動きで、2色間を10段階で色コード（16進数）とともに新規に作成表示する。
❖ カラーサンプルジェネレータもどき（２）
単色を入力し、[作成]ボタンをクリック。入力した色をもとに、円形カラーピッカー右回り一周を10段階に分けて色相を取得して、色コード（16進数）とともに新規に作成表示する。
ジェネレータもどきは、各[作成]ボタンの下に結果を表示させたいが、作り方が下手くそなので、結果のみの表示になってしまう。もとのページに戻る場合は、リロード（ページ再読み込み）が必要。
なお、画像保存機能はないので、結果を保存する場合は、サンプル部分をスクリーンショット（画面キャプチャー）で撮り*、PhotoshopやIllustratorにペーストしたり、プレビュー.appで「クリップボードから新規作成」したりしている。
*よく使うスクリーンショット：「Command + Shift + Control + 4 」で矩形選択、クリップボードにコピー。
実際のカラーサンプルやのジェネレータもどきのページはこちら（私のwebサイトです）
0 件のコメント:
コメントを投稿