Googleスプレッドシートの標準カラーパレット一覧(色見本)【テンプレート】

Google Apps Script(GAS)でスプレッドシートの背景色や文字色を指定するとき、色のコード(#FFFFFFなど)を調べるのが面倒だと感じたことはありませんか?

標準のカラーパレットを確認するために何度も開き直したり、コードを探すのは手間がかかります。

この記事では、Googleスプレッドシートの標準カラーパレットを一覧にし、色名とコード(RGB)をセットにしたテンプレートをご提供します。

目次

テンプレート:標準カラーパレット一覧(色見本)

  • 標準カラーを系統別・濃淡順に整理
  • 色名とカラーコードを記載

下記リンクからダウンロード可能です。

👉標準カラーコード一覧テンプレートをダウンロード(無料)

コピーをご自身のGoogleドライブに保存してご利用ください。



Googleスプレッドシートの標準カラーパレット:80色
こちらの色名とカラーコード(RGB)を記載しています。

参考:カラーパレット一覧作成スクリプト

今回のカラーパレット一覧(色見本)は以下スクリプトにて作成しています。

自作する場合はこちらをご活用ください。

カラーパレット一覧作成スクリプト(GAS)
function createColorPaletteInNewSheet() {
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheetName = '標準カラーパレット'; // おすすめのシート名
  let sheet = ss.getSheetByName(sheetName);

  // シートが既にあれば削除して再作成
  if (sheet) ss.deleteSheet(sheet);
  sheet = ss.insertSheet(sheetName);
  
  const palette = [
    // 1行目
    {name: "黒", code: "#000000"},
    {name: "ダークグレー4", code: "#434343"},
    {name: "ダークグレー3", code: "#666666"},
    {name: "ダークグレー2", code: "#999999"},
    {name: "ダークグレー1", code: "#b7b7b7"},
    {name: "グレー", code: "#cccccc"},
    {name: "ライトグレー1", code: "#d9d9d9"},
    {name: "ライトグレー2", code: "#efefef"},
    {name: "ライトグレー3", code: "#f3f3f3"},
    {name: "白", code: "#ffffff"},

    // 2行目
    {name: "レッドベリー", code: "#980000"},
    {name: "赤", code: "#ff0000"},
    {name: "オレンジ", code: "#ff9900"},
    {name: "黄", code: "#ffff00"},
    {name: "緑", code: "#00ff00"},
    {name: "シアン", code: "#00ffff"},
    {name: "コーンフラワーブルー", code: "#4a86e8"},
    {name: "青", code: "#0000ff"},
    {name: "紫", code: "#9900ff"},
    {name: "マゼンタ", code: "#ff00ff"},

    // 3行目
    {name: "ライトレッドベリー3", code: "#e6b8af"},
    {name: "ライトレッド3", code: "#f4cccc"},
    {name: "ライトオレンジ3", code: "#fce5cd"},
    {name: "ライトイエロー3", code: "#fff2cc"},
    {name: "ライトグリーン3", code: "#d9ead3"},
    {name: "ライトシアン3", code: "#d0e0e3"},
    {name: "ライトコーンフラワーブルー3", code: "#c9daf8"},
    {name: "ライトブルー3", code: "#cfe2f3"},
    {name: "ライトパープル3", code: "#d9d2e9"},
    {name: "ライトマゼンタ3", code: "#ead1dc"},

    // 4行目
    {name: "ライトレッドベリー2", code: "#dd7e6b"},
    {name: "ライトレッド2", code: "#ea9999"},
    {name: "ライトオレンジ2", code: "#f9cb9c"},
    {name: "ライトイエロー2", code: "#ffe599"},
    {name: "ライトグリーン2", code: "#b6d7a8"},
    {name: "ライトシアン2", code: "#a2c4c9"},
    {name: "ライトコーンフラワーブルー2", code: "#a4c2f4"},
    {name: "ライトブルー2", code: "#9fc5e8"},
    {name: "ライトパープル2", code: "#b4a7d6"},
    {name: "ライトマゼンタ2", code: "#d5a6bd"},

    // 5行目
    {name: "ライトレッドベリー1", code: "#cc4125"},
    {name: "ライトレッド1", code: "#e06666"},
    {name: "ライトオレンジ1", code: "#f6b26b"},
    {name: "ライトイエロー1", code: "#ffd966"},
    {name: "ライトグリーン1", code: "#93c47d"},
    {name: "ライトシアン1", code: "#76a5af"},
    {name: "ライトコーンフラワーブルー1", code: "#6d9eeb"},
    {name: "ライトブルー1", code: "#6fa8dc"},
    {name: "ライトパープル1", code: "#8e7cc3"},
    {name: "ライトマゼンタ1", code: "#c27ba0"},

    // 6行目
    {name: "ダークレッドベリー1", code: "#a61c00"},
    {name: "ダークレッド1", code: "#cc0000"},
    {name: "ダークオレンジ1", code: "#e69138"},
    {name: "ダークイエロー1", code: "#f1c232"},
    {name: "ダークグリーン1", code: "#6aa84f"},
    {name: "ダークシアン1", code: "#45818e"},
    {name: "ダークコーンフラワーブルー1", code: "#3c78d8"},
    {name: "ダークブルー1", code: "#3d85c6"},
    {name: "ダークパープル1", code: "#674ea7"},
    {name: "ダークマゼンタ1", code: "#a64d79"},

    // 7行目
    {name: "ダークレッドベリー2", code: "#85200c"},
    {name: "ダークレッド2", code: "#990000"},
    {name: "ダークオレンジ2", code: "#b45f06"},
    {name: "ダークイエロー2", code: "#bf9000"},
    {name: "ダークグリーン2", code: "#38761d"},
    {name: "ダークシアン2", code: "#134f5c"},
    {name: "ダークコーンフラワーブルー2", code: "#1155cc"},
    {name: "ダークブルー2", code: "#0b5394"},
    {name: "ダークパープル2", code: "#351c75"},
    {name: "ダークマゼンタ2", code: "#741b47"},

    // 8行目
    {name: "ダークレッドベリー3", code: "#5b0f00"},
    {name: "ダークレッド3", code: "#660000"},
    {name: "ダークオレンジ3", code: "#783f04"},
    {name: "ダークイエロー3", code: "#7f6000"},
    {name: "ダークグリーン3", code: "#274e13"},
    {name: "ダークシアン3", code: "#0c343d"},
    {name: "ダークコーンフラワーブルー3", code: "#1c4587"},
    {name: "ダークブルー3", code: "#073763"},
    {name: "ダークパープル3", code: "#20124d"},
    {name: "ダークマゼンタ3", code: "#4c1130"},
  ];

  palette.forEach((color, index) => {
    const row = Math.floor(index / 10) + 2;  
    const col = (index % 10) + 2;            
    const cell = sheet.getRange(row, col);
    
    // 名前とコードの間に空白行を追加
    cell.setValue(`${color.name}\n\n${color.code}`);
    cell.setBackground(color.code);
    cell.setFontColor(isDarkColor(color.code) ? 'white' : 'black');
    cell.setVerticalAlignment('middle').setHorizontalAlignment('center').setWrap(true);
  });

  // 見やすくするための列幅と行高を設定
  sheet.setColumnWidths(2, 10, 120); 
  sheet.setRowHeights(2, Math.ceil(palette.length / 10), 80);
}

function isDarkColor(hexColor) {
  const c = hexColor.substring(1); 
  const rgb = parseInt(c, 16);   
  const r = (rgb >> 16) & 0xff;
  const g = (rgb >> 8) & 0xff;
  const b = (rgb >> 0) & 0xff;
  const luminance = (0.299*r + 0.587*g + 0.114*b);
  return luminance < 140;
}

弊社では、Google Apps Script(GAS)を活用した業務効率化のサポートを提供しております。

GASのカスタマイズやエラー対応にお困りの際は、ぜひお気軽にご相談ください。

また、ITツールの導入支援やIT導入補助金の申請サポートも行っております。

貴方の業務改善を全力でサポートいたします。

お問い合わせはこちら

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

目次