地は純白 #ffffff。テキストとフッターは #222222 で、純黒は使わない。彩度を持つのは ANDPAD レッド #ef3340 ただ一色で、帯・輪郭・見出し脇の矩形・アイコンに「点」で置く。セクションの面は #fafafa という、白との差がごくわずかな極薄グレー。
和文はモリサワ TypeSquare の 2 書体。本文・UI が「中ゴシック BBB」、強調段落・小見出しが「太ゴ B101」で、太さはファミリー名の切り替えで作る。英字の見出しだけ自社ホストの SF Display に切り替わる和欧分離型。html の font-size は 14px で、すべてのサイズが 14 の倍数の rem として刻まれる。body の font-weight は 505 という中間値。
建設業の現場では、図面と工程と写真と原価が、それぞれ別の場所に置かれてきました。ひとつの変更が起きるたびに、電話とファックスと手戻りが発生します。
ANDPAD は、その分断をなくすところから始まりました。現場で撮った写真が、そのまま報告書になる。工程を動かせば、関わる全員に届く。当たり前のことを、当たり前にできるようにしています。
本文の行間は 1.85。太字にしたら 2.2 まで広げます。中ゴシック BBB は字面が詰まって見えやすいので、太さを足したぶんだけ余白も足す、という考え方です。サービスサイトを見る。
※ 図版キャプションはこのサイズ。11.9px / weight 700 / lh 1.3
CTA は面色を持たない。1px のアウトラインとピル（radius 38.36px）だけで作り、背景に応じて赤枠 / 白枠 / 黒枠に反転させる。角丸が許されるのはこのピルとアイコンの円のみで、それ以外はすべて radius 0。
面 #fafafa の上にカードを置く。border-radius は 0、box-shadow は使わない。奥行きは余白と面色の差だけで作る。
デフォルト / フォーカス / エラーの3状態。入力欄は radius 0（ピルにしない）。フォーカスは #ef3340、エラーは沈んだ赤 #c8102e で CTA の赤と区別する。
ANDPAD のサイトには box-shadow が 1 つも存在しない。奥行きは面色の差と余白だけで作る。浮かせたいときは影ではなく余白を広げるか、面色を変える。
rem 基準が 14px なので、余白も 7 / 14 の倍数で刻む。コンテナは最大 1140px、2 カラムは 570px ずつ。