Bilibili
哔哩哔哩
Tracearr
Tracearrの公式ベクターロゴ。ソーシャルメディアカテゴリ。SVG と 1024px の透過 PNG でダウンロードできます。
ブランドカラー
クリックでカラーコードをコピーダウンロード
ADChatGPT Plus·公式の共有・専用プラン · GPT-6.1 Sol / Deep Research をすぐに利用クーポン 6666888 で 5% オフ
ADNetflix 4K·専用プロフィール · PIN ロック · 全デバイス対応クーポン 6666888 で 5% オフ
- ベクター形式
- SVG · 6:7
- 書き出し解像度
- 1024 × 1024 px
- viewBox
- 8 4 48 56
- ファイルサイズ
- 1.1 KB · 7 パス
編集と書き出し
色の変更、背景や余白の追加をしてから書き出せます。処理はすべてブラウザ内で行われます。
カラー
背景
形式
サイズ
SVG、PNG 16–2048px、JPG、WebP、ICO、ファビコンセットを含みますTracearr.zip
ブランド仕様と SVG パラメーター
デザインシステムや実装で参照できる公式カラー、viewBox、コントラストの実測値
- ブランド / 表示名
- Tracearr
- カテゴリ
- ソーシャルメディア
- 公式カラー (HEX / RGB / HSL)
- #18D1E7rgb(24, 209, 231) · hsl(186, 81%, 50%)
- WCAG コントラストとファイルサイズ
- 白背景 1.9:1 · 黒背景 10.7:1 · 1.1 KB
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="8 4 48 56">
<!-- Background shield shape -->
<path d="M32 4L8 14v18c0 14 10 24 24 28 14-4 24-14 24-28V14L32 4z" fill="#0B1A2E"/>
<!-- Inner shield -->
<path d="M32 8L12 16v14c0 12 8.5 20.5 20 24 11.5-3.5 20-12 20-24V16L32 8z" fill="#162840"/>
<!-- T-path stylized -->
<path d="M22 24h20v4H34v16h-4V28H22v-4z" fill="#18D1E7"/>
<!-- Radar arcs -->
<path d="M32 20a16 16 0 0 1 11.3 4.7" stroke="#18D1E7" stroke-width="2" stroke-linecap="round" fill="none" opacity="0.6"/>
<path d="M32 16a20 20 0 0 1 14.1 5.9" stroke="#18D1E7" stroke-width="2" stroke-linecap="round" fill="none" opacity="0.4"/>
<path d="M32 12a24 24 0 0 1 17 7" stroke="#18D1E7" stroke-width="2" stroke-linecap="round" fill="none" opacity="0.2"/>
<!-- Glow effect -->
<defs>
<filter id="glow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="1" result="blur"/>
<feMerge>
<feMergeNode in="blur"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>
<path d="M22 24h20v4H34v16h-4V28H22v-4z" fill="#18D1E7" filter="url(#glow)"/>
</svg>使用上の注意
- 元の 6:7 の縦横比（viewBox "8 4 48 56"）を保って拡大縮小し、変形させないでください。
- ロゴの周囲には、ロゴの高さの 20% 以上の余白を確保してください。
- 暗い背景では、白抜き版、明るい下地、または公式のダーク版を優先して使ってください。
