iRIC ブランドガイド

サイトごとに識別色を1つ持ちます。ロゴの地色、リンク、ボタン、見出しの線など、 そのサイトの性格を決める色はすべてこの色から取ります。

2010 年からのマークが正です。新しいマークは起こしていません。現行ロゴを白で抜き、円の地色だけをサイトごとに変える方式です。 将来ロゴを刷新しても、差し替えるのは円の中身だけで済みます。

タイルの地色はこれらのグラデーションで作ります。 緑だけは画面用と会場用で 2 つ持ちます。

タイルの地色をそのまま文字に使わないでください。 面として気持ちのよい明るさと、文字として読める濃さは違います。 サイトごとに、面用と文字用の 2 つを持ちます。

受付中・開催中・正解・不正解のように、状態を示す色は識別色とは別に持ちます。 同じ色にすると「サイトの色だからこの色なのか、状態を示しているのか」が読み取れません。 正解が緑・不正解が赤のように意味が世の中で決まっているものは、状態色を優先します。

ロゴを触るときは、必ず正本を直してから各サイトへ配る順序で作業します。

共通ヘッダーのボタンをサイトの色にする

共通ヘッダーのログインボタンは既定が iRIC Blue です。 アプリ側で次の変数を定義すると、そのサイトの色になります。 この変数は共通 CSS では定義していないので、読み込み順を気にせず上書きできます。

/* 各アプリの globals.css */
:root {
  --iric-service-brand: #367B1C;        /* Events の例 */
  --iric-service-brand-strong: #2C611D;
}
@media (prefers-color-scheme: dark) {
  :root {
    --iric-service-brand: #3F8F28;
    --iric-service-brand-strong: #4FA634;
  }
}

サービス名の色

ロゴの右に置くサービス名は、アプリ側のヘッダーから serviceColor で渡します。

<IricSiteHeader serviceName="Events" serviceColor="#3E8C22" … />

このページで配布しているロゴ・シンボル・ロゴタイプ（以下「iRIC のロゴ」）の権利は 一般社団法人iRIC-UC に帰属します。ダウンロードできることは、使用を許諾したことを 意味しません。下の区分に従ってご利用ください。

どの区分でも認められないこと

使い方の決まり

余白・最小サイズ・背景との組み合わせは、このページの「ロゴ」「ブランドカラー」の 節に従ってください。色が使えない場面ではモノクロ版・白版を用意しています。

ダウンロード

SVG と PNG を ロゴのダウンロードに用意しています。 一式の ZIP には、この条件を記した 利用条件.txt を同梱しています。

お問い合わせ

許諾の申請、判断に迷う場合、この案内に無い用途についてのご相談:
一般社団法人iRIC-UC　staff@i-ric.org

この案内は予告なく改定することがあります。改定前に開始した使用を、 改定によってさかのぼって問題にすることはありません。