タグクラウドコンポーネント
ポートフォリオに適した単色の配色を使用した、魅力的なアニメーションを備えたレスポンシブタグクラウドコンポーネント。
HTMLコード
<div class="p-6 bg-gray-800 text-white dark:bg-gray-900">
<h2 class="text-2xl font-semibold mb-4">Tag Cloud</h2>
<div class="flex flex-wrap">
<a href="#" class="m-2 p-3 bg-blue-600 hover:bg-blue-700 transition duration-300 ease-in-out rounded shadow-lg transform hover:scale-105">Web Design</a>
<a href="#" class="m-2 p-3 bg-blue-600 hover:bg-blue-700 transition duration-300 ease-in-out rounded shadow-lg transform hover:scale-105">Development</a>
<a href="#" class="m-2 p-3 bg-blue-600 hover:bg-blue-700 transition duration-300 ease-in-out rounded shadow-lg transform hover:scale-105">Photography</a>
<a href="#" class="m-2 p-3 bg-blue-600 hover:bg-blue-700 transition duration-300 ease-in-out rounded shadow-lg transform hover:scale-105">Branding</a>
<a href="#" class="m-2 p-3 bg-blue-600 hover:bg-blue-700 transition duration-300 ease-in-out rounded shadow-lg transform hover:scale-105">UI/UX</a>
<a href="#" class="m-2 p-3 bg-blue-600 hover:bg-blue-700 transition duration-300 ease-in-out rounded shadow-lg transform hover:scale-105">Digital Marketing</a>
</div>
</div>関連コンポーネント
タグクラウドコンポーネント13
Neumorphism スタイルでデザインされたタグクラウドコンポーネント。ソフトな UI スタイルが特徴で、微妙な影を使用して背景から押し出されているように見える要素があります。このコンポーネントは、レスポンシブデザインとダークテーマをサポートしています。