KIGI
アートディレクション / グラフィック / プロダクト・アート
We are KIGI.

植原亮輔と渡邉良重による、東京のデザインスタジオ。詩的で、遊びがあって、精度がある。極小の和文と特大の欧文が同居するデザインシステム。

VIEW WORKS WE ARE…
01 — COLORS

Colors

カラーパレット

地は柔らかいライトグレー #e6e6e6。テキストは暗褐色 #221815(純黒ではない)。作品面・ホバー面にのみ黒 #000000 を使い、アシッドなミント/ティールを点で効かせる。

Warm Near-Black
#221815
テキスト基本色(温かみのある黒)
Light Gray
#e6e6e6
地色・キャンバス
Black
#000000
作品面・ホバー面のみ
Accent Teal
#00c69e
ナビ・リンクのアクセント
Vivid Mint
#00ffcc
メニューパネルの面色
Muted Teal
#78c2be
淡ティール・補助アクセント
White
#ffffff
カード面・反転文字
Gray Border
#d9d9d9
罫・入力枠
Sub Text
#6b6b6b
補助テキスト
Error
#cf2e2e
エラー(WPプリセット流用)

02 — TYPOGRAPHY

Typography

タイポグラフィ

和文 FOT-筑紫ゴシック Pr5 L を極小(10px)で、欧文 Helvetica を特大(28〜65px)で使う大小のコントラストが核心。全体に palt を適用。欧文は Bold 700 と Light 200 の二極。

Graphic
Work Title · Helvetica Bold · 65px · weight 700 · lh 1.1(作品上は白抜き)
WORKS WE ARE… NEWS
Nav · Helvetica Bold · 28px · weight 700 · lh 1.0 · color #00c69e
info@ki-gi.com
Footer · Helvetica Light · 30px · weight 200 · ls 0.058em(1.75px)
和文ナビ・本文 — キギは、植原亮輔と渡邉良重によるデザインスタジオです。極小の筑紫ゴシックを空気のように置き、特大の欧文と落差をつくります。
Body/Nav (JP) · 筑紫ゴシック Pr5 L · 10px · weight 400 · lh 1.5 · palt
本文(読み物用に少し大きめ) — アートディレクション、グラフィックデザイン、プロダクトとアートを横断して、日々の暮らしにそっと寄り添うものをつくっています。
Article body · 13px · weight 400 · lh 2.0 ※プレビュー可読性のため拡大

03 — ARTICLE

Article

組版サンプル

We are KIGI.

わたしたちは、キギ。

KIGI は、アートディレクター 植原亮輔とデザイナー 渡邉良重が 2012 年に立ち上げたデザインスタジオです。DRAFT 在籍時に生まれた D-BROS のものづくりを引き継ぎながら、アートディレクション・グラフィック・プロダクト/アートを自由に横断しています。

詩のように軽やかで、遊びがあって、けれど手仕事の精度をあきらめない。極小の和文と特大の欧文がひとつの画面に同居する組版は、その姿勢そのものです。WORKS を見る


04 — BUTTONS

Buttons

ボタン

実サイトは塗り CTA を持たない「タイポグラフィがナビを兼ねる」設計。以下は識別性を保った推定・オンブランドの拡張。暗褐色ソリッドとティール・アウトラインを基調に、角丸は 0。

CONTACT VIEW WORKS WE ARE…

05 — CARDS

Works

作品カード(ホバーで黒面に沈み白抜きタイトル)
Graphic
ブランドのためのグラフィック
Art Direction / 2024
Product
暮らしに寄り添うプロダクト
Product / Art / 2023
Art
絵と言葉のためのアートワーク
Art / 2025

06 — FORMS

Forms

フォーム

デフォルト / フォーカス / エラーの3状態。radius 0、フォーカスはアシッドティール #00c69e、エラーは #cf2e2e。

正しい電話番号を入力してください。
送信する

07 — ELEVATION

Elevation

奥行き(WordPress プリセットの実在トークン)

基本はライトグレー地と黒面のコントラストでフラットに。影を使うなら natural / sharp / crisp のオフセット影でグラフィカルに。

Level 0 — none
フラット(既定)
Level 1 — natural
6px 6px 9px rgba(0,0,0,.2)
Level 2 — sharp
6px 6px 0 rgba(0,0,0,.2)
Level 3 — crisp
6px 6px 0 rgba(0,0,0,1)

08 — LAYOUT

Layout

スペーシング(--wp--preset--spacing 換算)

7 / 11 / 16 / 24 / 36 / 54 / 81px。余白を広めに取り、作品グリッドの間にライトグレーの地を効かせる。

XS 7
S 11
M 16
L 24
XL 36
XXL 54
XXXL 81