シンプルなカラースキーム集 Color Recipes を作った

·1 分で読めます
シンプルなカラースキーム集 Color Recipes を作った

タグで配色を絞り込めるカラースキーム集 color.recipes を公開しました。

気に入った配色は各種形式でダウンロード・コピーできます。

GitHub の公開リポジトリでスキームを管理しているので、無い組み合わせは自分で作って PR で追加できます。

モチベーション

同じような配色サービスは既にいくつもあります。

ただ、余分な機能が付いていたり、広告が出ていたりするものばかりで、気に入ったものがありませんでした。

自分にあった、気持ちよく使える、シンプルなカラースキーム集を目指して、このソフトウェアを作り始めました。

つかいかた

  • タグで絞り込む。複数選ぶと、その全部に当てはまる配色だけに絞れます(例: wintercity の両方)。
  • 気に入った配色は CSS・SCSS・Tailwind・JSON・SVG・Swift など各種形式でダウンロード・コピーできます。
  • 各配色に パーマリンクがあります。共有すると、その配色のサムネイル(OpenGraph 画像)が出ます。

無い組み合わせは、自分で作って PR

検索してゼロ件だったときは、その場で配色を作って追加できます。

検索がゼロ件のときに表示される、配色生成プロンプトと JSON 貼り付け・投稿フォーム

  1. 表示される AI 用プロンプトをコピーする
  2. 手元の生成 AI に貼って、配色 JSON を作らせる
  3. その JSON を貼り戻すと、その場でプレビューできる
  4. GitHub でログインし、Fork 先(自分のアカウント or org)を選ぶ
  5. ボタンひとつで Fork → コミット → PR まで作られる

配色データはリポジトリの schemes/*.json に置かれているだけなので、投稿は「JSON を 1 ファイル足す PR」になります。

フィードバックのお願い

フィードバックは GitHub Issue で受け付けています。不具合や気づいたことがあれば登録してください。

それから、新しい配色の登録 PR をぜひお願いします。リポジトリはこちらです。

https://github.com/ngs/color.recipes