スタイルガイド

AyniHealth のブランドに準拠したウェブサイト、印刷物、ソーシャルメディア投稿を制作するための実践的なリファレンスです。

ロゴ

AyniHealth のロゴは、特徴的なブルーからパープルへのグラデーションマークとワードマークから構成されます。ロゴの周囲には十分な余白を確保し、プロポーションを歪めないようにしてください。

ロゴと名称の組み合わせ

AyniHealth^™

ロゴグラデーション: ロゴマークには、ディープブルー (#1539ba) からバイオレット (#b04cc3) へのマルチストップ・リニアグラデーションを使用しています。

#1539ba → #b04cc3

ロゴ素材のダウンロード

Adobe Illustrator (.ai)

ソース

621 KB — レイヤーとグラデーション定義を含む編集可能なソースファイル

ベクター（スケーラブル、印刷および大判用）

SVG

4 KB — ウェブ、レスポンシブレイアウト、アイコン向けにスケーラブル

PDF

285 KB — ドキュメントやサイネージ向けの印刷用ベクター

ビットマップ（固定解像度、ウェブおよびソーシャルメディア用）

PNG (1334 x 1334)

169 KB — 透過背景、高解像度

JPEG (667 x 667)

111 KB — 白背景、ファイルサイズ小

カラーパレット

プライマリカラー

Ayni Purple

HEX: #9370db

OKLCH: oklch(0.61 0.22 293)

ボタン、リンク、見出し、インタラクティブなアクセントなど、プラットフォーム全体で使用されます。

ロゴグラデーション

#1539ba

#b04cc3

ロゴマークとヒーロー装飾要素のみで使用します。テキストカラーとしては使用しないでください。

デザインシステムトークン

Background

--background

Foreground

--foreground

Card

--card

Muted

--muted

Muted Foreground

--muted-foreground

Border

--border

タイポグラフィ

プライマリフォント

AyniHealth はプライマリフォントとして Geist Sans を使用し、Inter と system-ui をフォールバックとしています。Geist は UI、マーケティング、印刷物すべてに使用されます。

Geist Sans → Inter → system-ui → sans-serif

フォントウェイト

Bold (700)

ページタイトル、ヒーロー見出し

Semibold (600)

セクション見出し、カードタイトル、ロゴワードマーク

Medium (500)

ナビゲーション、ラベル、強調

Regular (400)

本文、説明

ビデオ会議用背景

ビデオ通話やバーチャルミーティングでチームの一貫したプロフェッショナルな印象を保つため、このブランド背景をご利用ください。

背景をダウンロード

PNG — 1920 × 1080 px (Full HD)

商標と使用方法

テキスト内でブランドに言及する際は、各ドキュメントやページの最初の言及時に必ず商標表示を使用してください。

最初の言及：AyniHealth™（商標記号付き）
以降の言及：AyniHealth（記号不要）
ブランド表記では「Ayni Health」（二語）と書かない
プロダクト名：Connect、Catalyst、Compass（大文字始まり、商標記号なし）
法人名：AyniHealth Group