Наверх кнопка Минималистичный яркий
Минималистичный и плоский компонент кнопки «Наверх» с яркими цветами, подходящий для сайта-портфолио. Он включает в себя адаптивный дизайн и поддержку темного режима с использованием Tailwind CSS.
HTML-код
<a href="#" class="fixed bottom-6 right-6 bg-blue-500 hover:bg-blue-700 text-white p-3 rounded-full shadow-lg transition-colors duration-300 dark:bg-blue-700 dark:hover:bg-blue-900">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 10l7-7m0 0l7 7m-7-7v18"></path>
</svg>
</a>
Связанные компоненты
Наверх Компонент кнопки
Отзывчивая кнопка «Вернуться наверх» с эстетикой Material Design, монохроматической цветовой схемой и поддержкой темного режима. Она отображается в виде плавающей кнопки действия (FAB) в правом нижнем углу.
Кнопка «Наверх»
Адаптивный компонент кнопки «Наверх», разработанный с эффектом стекломорфизма, подходит для профессиональных бизнес-сайтов. Он отличается простой версткой с минимальным количеством элементов и хорошо работает как в светлой, так и в темной темах.
Наверх Компонент кнопки
Отзывчивая кнопка «Задом наверх» с дизайном, вдохновленным бумагой/печатью, в черно-белой цветовой гамме с тонким акцентом. Подходит для образовательных платформ, включает в себя поддержку темного режима и чистый, доступный макет.