Компонент отображения цен
Компонент отображения минимальной цены с поддержкой отзывчивого и темного режима
HTML-код
<div class="bg-white dark:bg-gray-800 rounded-lg px-6 py-8 ring-1 ring-slate-900/5 shadow-xl">
<div>
<span class="inline-flex items-center justify-center p-2 bg-indigo-500 rounded-md shadow-lg">
<svg class="h-6 w-6 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"></svg>
</span>
</div>
<h3 class="mt-5 text-base font-medium tracking-tight text-slate-900 dark:text-white">Price</h3>
<p class="mt-2 text-sm text-slate-500 dark:text-slate-400">
<span class="text-2xl font-bold text-slate-900 dark:text-white">$99.99</span>/month
</p>
</div>Связанные компоненты
Компонент отображения цен
Компонент сложного отображения цен в ретро-винтажном стиле для портфолио, отличающийся триадической цветовой схемой, отзывчивостью и поддержкой темного режима с использованием Tailwind CSS. JavaScript не включен.
Компонент отображения цен 22
Минималистичный компонент отображения цен, который отображает изображение, название, цену и кнопку для добавления в корзину. Разработан с учетом отзывчивости и поддержки темных тем с использованием Tailwind CSS.
Компонент отображения цен
Компонент отображения цен в стиле Neumorphism с дополнительной цветовой схемой (мягкий оранжевый и голубой), умеренной сложности для электронной коммерции. Он отличается адаптивным дизайном с поддержкой темных тем. Компонент отображает изображение товара, название и цену с помощью кнопки «Добавить в корзину». В темном режиме используются ненасыщенные дополнительные цвета.