DIG×CROSS
COMPONENTS

DIGROSS FOUNDATIONS

FOUNDATIONS

DIGROSSの土台となる、色・文字・余白のルール。
迷ったら常にこのページに立ち返る。

COLORS

カラー
#09090B

Base

Deep Black — #09090B

#A1A1AA

Muted

Gray — #A1A1AA

#CCFF00

Accent

Neon Lime — #CCFF00

USAGE #09090B — ページ背景。迷ったらこれ。面はvoid→surfaceの4層で奥行きを作る

USAGE #A1A1AA — 補助テキスト。本文の脇役。効かせたい文字はfg(#F4F4F5)

USAGE #CCFF00 — CTA・アクティブ・熱量の表現。大きく使うのは1画面1〜2箇所まで。二色の緊張感がDIGROSSの顔

FULL PALETTE — 全トークン

#09090B

void

#0C0C0E

abyss

#121215

surface

#1A1A1E

surface-2

#26262B

line

#3A3A41

line-strong

#F4F4F5

fg

#A1A1AA

muted

#71717A

dim

#EDE8DA

cream

#CCFF00

lime

#86A800

lime-dark

TYPOGRAPHY

タイポグラフィ

H1: DEEP STREET

DEEP STREET

FONT
Anton
WEIGHT
400(塊の極太)
SIZE
60〜128px
USAGE
ヒーロー・英字見出し

H2: 漆黒の見出し

才能を、
ディグれ。

FONT
Noto Sans JP
WEIGHT
900 (Black)
SIZE
30〜48px
USAGE
日本語見出し

P: LO-FI CHILL

深夜2時のビートに、
言葉を乗せる。

FONT
Noto Sans JP
WEIGHT
300 (Light)
SIZE
18〜20px
USAGE
引用・キャッチコピー

P: BODY

DIGROSSは、トラックメイカー、ラッパー、MIXエンジニアが出会う場所。役割とジャンルで検索して、気になる才能をDigしよう。

FONT
Inter + Noto Sans JP
WEIGHT
400 (Regular)
SIZE
14〜16px
USAGE
本文・説明文

LABEL: MONO

DIGROSS — TOKYO / 03:24 / 92 BPM

FONT
Geist Mono
WEIGHT
400
SIZE
11〜12px
USAGE
ラベル・数値・仕様

RULE — 「重厚」はAnton/Black(900)で塊を作り、「チル」はLight(300)+広い字間で余白を作る。中間ウェイトを多用せず、太いか細いかをはっきりさせるのがDIGROSSのメリハリ。

SPACING

余白
4px
タグ同士のすき間
8px
ラベルと本文の間
12px
カード内の要素間
20px
カードの内側余白 (p-5)
24px
カード同士のすき間
56px
セクション内の区切り
112px
セクション同士の間

BUTTONS

ボタン

RULE — 主役はライム地×漆黒文字、ホバーでネオングロー。二番手は罫線、三番手は無地。1画面にライムの主役ボタンは原則1つ。

FORMS

入力欄

TAGS / BADGES

タグとバッジ

GENRE TAG — 選択状態はライム

#HIPHOP#Lo-Fi#Trap#Boom Bap#Drill#Jazz Hip Hop#R&B#Chill

ROLE BADGE — 役割

オーガナイザートラックメイカーラッパーMIXエンジニアシンガーDJ

SERIOUSNESS — 本気度

プロ志向本気で活動中趣味で楽しむ

CARDS

発掘カード(discover画面の主役)
プロ志向

AKARI

@akari_flows東京

ラッパーシンガー

フックに命かけてます。トラックメイカーとのコライト相手を探しています。

#HIPHOP#R&B
本気で活動中

yotsuya beats

@yotsuya_lofi大阪

トラックメイカー

深夜のためのビートを作っています。声を乗せてくれるラッパー募集中。

#Lo-Fi#Jazz Hip Hop
趣味で楽しむ

D-MIX

@dmix_studio福岡

MIXエンジニアDJ

週末エンジニア。駆け出しの音源を丁寧に磨きます。まずは1曲から。

#Trap#Drill

PLAYER

下部固定プレーヤー(将来の席)

Midnight Crossing

MC NEON × yotsuya beats

RULE — 波形が主役(SoundCloudへのオマージュ)。再生済みはライム、未再生は罫線色。MVPでは非表示のまま席だけ確保する。

GRADIENTS

グラデーション(重厚とチルの同居)

NEON HAZE

ヒーロー・強調エリア。漆黒に滲むライム

SMOKE

カード・パネルの基本。重厚な奥行き

DUSK

チルな差し色面。Lo-Fiの夜明け前