レトロバッジ
補完的な配色を備えたビジネス/企業のWebサイト向けのレトロ/ビンテージバッジコンポーネント。シンプルなレイアウト、ダークテーマをサポートするレスポンシブデザイン。JavaScript はありません。
HTMLコード
<div class="flex flex-wrap gap-2 p-4 bg-gray-100 dark:bg-gray-900">
<!-- Badge 1 -->
<span class="px-3 py-1 text-sm font-semibold text-purple-800 bg-purple-200 rounded-full dark:text-purple-200 dark:bg-purple-800">
Vintage Vibe
</span>
<!-- Badge 2 -->
<span class="px-3 py-1 text-sm font-semibold text-yellow-800 bg-yellow-200 rounded-full dark:text-yellow-200 dark:bg-yellow-800">
Retro Style
</span>
<!-- Badge 3 -->
<span class="px-3 py-1 text-sm font-semibold text-green-800 bg-green-200 rounded-full dark:text-green-200 dark:bg-green-800">
Classic Look
</span>
</div>関連コンポーネント
バッジコンポーネント
Skeuomorphismスタイル、Triadicカラースキーム、シンプルな複雑さを備えたレスポンシブBadgesコンポーネントで、ダークテーマをサポートするポートフォリオ向けに設計されています。