Минималистичный компонент входа через социальные сети
Минималистичный компонент входа через социальные сети в оттенках серого для электронной коммерции, простой, отзывчивый, поддержка темных тем, без JavaScript
HTML-код
<div class="flex flex-col items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-900">
<div class="w-full max-w-sm p-6 bg-white rounded-md shadow-md dark:bg-gray-800">
<h1 class="text-2xl font-semibold text-center text-gray-700 dark:text-white">Login</h1>
<div class="flex justify-center mt-4 space-x-4">
<button class="px-4 py-2 text-gray-700 bg-gray-200 rounded-md dark:bg-gray-700 dark:text-gray-200">Facebook</button>
<button class="px-4 py-2 text-gray-700 bg-gray-200 rounded-md dark:bg-gray-700 dark:text-gray-200">Google</button>
<button class="px-4 py-2 text-gray-700 bg-gray-200 rounded-md dark:bg-gray-700 dark:text-gray-200">Twitter</button>
</div>
</div>
</div>
Связанные компоненты
Роскошный компонент входа в социальные сети для приложения «Погода»
Элегантный и сложный компонент входа в социальные сети, разработанный для приложений погоды и климата, отличается высокой контрастностью цветов, улучшенной типографикой и поддержкой темного режима. Он предлагает несколько вариантов входа в систему и современный премиальный интерфейс.
Компонент входа в социальные сети в стиле ар-деко
Сложный компонент входа через социальные сети, разработанный в стиле ар-деко для CRM/Business Tools, с геометрическими узорами, теплыми нейтральными тонами и полной отзывчивостью с поддержкой темного режима.
Компонент входа через социальные сети - Микровзаимодействия
Карточка компонента входа через социальные сети, использующая Tailwind CSS, с микровзаимодействиями на кнопках (эффект масштабирования при наведении/фокусе), отзывчивостью (максимальная ширина по центру) и поддержкой темных тем. Использует изображение-заполнитель из picsum.photos и встроенные SVG для значков социальных сетей. Нет JavaScript.