アイコノグラフィ

角丸スクエアのタイル仕様。48x48 のフレーム、12px のラディウス、ティント付き背景。

アイコン・タイルの仕様

Tile size	48x48
Tile radius	12px
Inline icon	12px to 16px
Toolbar / nav icon	20px
Card icon	24px to 28px inside a 48x48 tile
Stroke	2 round/round
ViewBox	24 24

ティント

cyan

rgba(0, 139, 139, 0.3)

bg:icon-tint:cyan

green

rgba(34, 197, 94, 0.3)

bg:icon-tint:green

purple

rgba(124, 77, 255, 0.3)

bg:icon-tint:purple

orange

rgba(251, 146, 60, 0.3)

bg:icon-tint:orange

blue

rgba(59, 130, 246, 0.3)

bg:icon-tint:blue

red

rgba(239, 68, 68, 0.3)

bg:icon-tint:red

ダッシュボードアイコン

BetterGuard ダッシュボードのナビゲーションで使用される標準の製品アイコンセット。Heroicons v2 outline を 24x24、stroke 2 round/round で、インラインで提供します (アイコンライブラリなし、sprite なし)。ダッシュボードに新しいアイコンが追加されるたびに、ここにも反映してください。

難読化保護

履歴保護

設定保護

テスターフォーラム保護

ブループリント保護

チケットサポート

ヘルプサポート

エージェントシステム

ステータスシステム

Admin システム

Stroke: #9ca3af inactive (shown above) · #22d3ee active. Both inherited via stroke="currentColor" from the surrounding .nav-item color.

Admin のシールドはカスタムパスであり、標準の Heroicons ではありません。標準の Heroicons のシールドに置き換えないでください。

<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
</svg>

例: Obfuscate (lock-closed)。このマークアップを Blade テンプレートにそのままコピーしてください。stroke="currentColor" は周囲のテキストの色を継承します。

推奨サイズ

インラインアイコン: 12～16px。ツールバー/ナビ: 20px。48x48 タイル内のカード・アイコン: 24～28px。ロゴ・ヘッダー: 32～40px。Apple touch icon: 180px。