Компоненты Облако тегов Компонент облака тегов

Компонент облака тегов

Компонент облака 3D Tag с яркими цветами для панелей визуализации данных.

Предварительный просмотр

HTML-код

<div class="flex flex-wrap gap-2 p-4 bg-gray-100 dark:bg-gray-800 rounded-lg shadow-lg">
  <span class="bg-blue-500 text-white px-3 py-1 rounded-full text-sm font-semibold shadow-md dark:bg-blue-700 transform transition duration-300 hover:scale-110 hover:rotate-3" style="perspective: 1000px; transform: rotateY(15deg) rotateX(5deg);">Marketing Analysis</span>
  <span class="bg-red-500 text-white px-3 py-1 rounded-full text-sm font-semibold shadow-md dark:bg-red-700 transform transition duration-300 hover:scale-110 hover:-rotate-6" style="perspective: 1000px; transform: rotateY(-10deg) rotateX(-3deg);">Sales Performance</span>
  <span class="bg-green-500 text-white px-3 py-1 rounded-full text-sm font-semibold shadow-md dark:bg-green-700 transform transition duration-300 hover:scale-110 hover:rotate-4" style="perspective: 1000px; transform: rotateY(5deg) rotateX(10deg);">Customer Feedback</span>
  <span class="bg-yellow-500 text-white px-3 py-1 rounded-full text-sm font-semibold shadow-md dark:bg-yellow-700 transform transition duration-300 hover:scale-110 hover:-rotate-4" style="perspective: 1000px; transform: rotateY(-5deg) rotateX(8deg);">Product Development</span>
  <span class="bg-purple-500 text-white px-3 py-1 rounded-full text-sm font-semibold shadow-md dark:bg-purple-700 transform transition duration-300 hover:scale-110 hover:rotate-2" style="perspective: 1000px; transform: rotateY(10deg) rotateX(-6deg);">Financial Reporting</span>
  <span class="bg-pink-500 text-white px-3 py-1 rounded-full text-sm font-semibold shadow-md dark:bg-pink-700 transform transition duration-300 hover:scale-110 hover:-rotate-2" style="perspective: 1000px; transform: rotateY(-8deg) rotateX(4deg);">Operational Efficiency</span>
  <span class="bg-indigo-500 text-white px-3 py-1 rounded-full text-sm font-semibold shadow-md dark:bg-indigo-700 transform transition duration-300 hover:scale-110 hover:rotate-5" style="perspective: 1000px; transform: rotateY(12deg) rotateX(-2deg);">Market Trends</span>
</div>

Связанные компоненты

Компонент облака тегов

Сложный компонент облака тегов на индустриальную тематику с осенними цветами, разработанный для веб-сайтов о сельском хозяйстве и фермерстве. Имеет несколько интерактивных элементов, полную отзывчивость и поддержку темных режимов.

Открытый

Компонент облака тегов в стиле ретро

Адаптивный компонент облака тегов, использующий Tailwind CSS, с эстетикой ретро/винтажного дизайна, пастельной цветовой гаммой и простой сложностью. Подходит для портфолио, в том числе с поддержкой темного режима.

Открытый

Компонент облака тегов

Компонент облака тегов, разработанный в стиле неоморфизма в оттенках серого, подходящий для блогов и потребления контента, с интерактивными элементами.

Открытый