10+ крутых и бесплатных библиотек CSS кнопок
Приветствую Вас, дорогие друзья! Давненько уже не было подборок с кнопками, но я исправляю это и представляю вам несколько библиотек с CSS кнопками, которые очень просто можно скачать и использовать на своём сайте. Друзья, если эта подборка вам понравилась, пожалуйста, поделитесь ей с друзьями! Приятного скачивания!
bttn.css — отличная библиотека кнопок для ваших проектов
Скачать
Коллекция крутых CSS кнопок совсем бесплатно
Скачать
Множество отличных и цветных кнопок для сайта на CSS
Скачать
Библиотека объёмных CSS кнопок
Скачать
Маленькие и стильные кнопки на CSS
Скачать
Библиотека CSS кнопок разного дизайна
Скачать
CSS кнопки с красивым эффектом при наведении
Скачать
Множество социальных кнопок на CSS
Скачать
Простая библиотека кнопок на CSS бесплатно
Скачать
Красивые и объёмные кнопки на CSS
Скачать
Классные CSS кнопки с использованием анимации
Скачать
35 красивых и бесплатных PSD кнопок для Вашего сайта
И снова здравствуйте уважаемые читатели блога. В этот уже снежный день, представляю Вам очередную подборку бесплатных PSD исходников замечательных кнопок для Вашего сайта. Как мы уже знаем очень, бывает, тяжело найти бесплатные и качественные кнопки в просторах интернета, и я думаю, что данная подборка очень поможет Вам, и здесь будет что выбрать, так как кнопок не мало. В общем наслаждайтесь.
Также рекомендую посмотреть прошлые подборки:
- Бесплатные анимированные кнопки для сайта с использованием CSS3
- 40 бесплатных PSD кнопок и иконок для Twitter на сайт
- Photoshop PSD исходники кнопок и иконок для сайта
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Скачать
Спасибо сайту www.2expertsdesign.com
Навигация, элементы форм, кнопки и ещё несколько полезностей на HTML и CSS
Здравствуйте, друзья. Это очередная и свежая подборка разных полезностей для верстальщика и дизайнера. Тут собрано несколько уроков и исходных файлов, которые выглядят очень красиво и стильно. А именно Вы тут можете встретить несколько красивых примеров типографики, которую Вы можете использовать на сайте, бесплатные уроки по созданию кнопок, а также бесплатные исходники, которые можно скачать, несколько красивых элементов форм, такие как чекбоксы и поля, и ещё самое вкусное это уроки по навигации и бесплатные их исходники.
Спасибо http://speckyboy.com и рекомендую:
3D типографика на CSS
Перейти
Текстовый эффект в Американском стиле
Перейти
Неоновый эффект для текста на CSS
Перейти
3D кнопка с прогресс баром на CSS
Перейти
Красивые кнопки с иконками
Перейти
Иконка гамбургер для навигации на HTML
Перейти
Двойные кнопки на CSS
Перейти
Эффекты для социальных кнопок
Перейти
Несколько красивых 3D кнопок в стиле Flat
Перейти
Как сделать плавно выезжающее меню на CSS
Перейти
Выпадающее меню на CSS
Перейти
Как сделать красивое меню с иконками
Перейти
Адаптивное меню которое плавно выезжает
Перейти
Адаптивное меню на HTML canvas
Перейти
Красивое меню с анимацией на CSS
Перейти
Фиксированная и вертикальная навигация
Перейти
Ещё крутая навигация на CSS
Перейти
Большое меню с крутым эффектом
Перейти
Стильное и классное меню на HTML
Перейти
Диагональное меню на CSS
Перейти
Анимированные чекбоксы как у Google
Перейти
Переключатели в стиле Flat бесплатно
Перейти
Чекбоксы в виде мечей из Звёздных войн
Перейти
Анимациаонные прогресс бары
Перейти
Форма с красивой анимацией
Перейти
Красивый слайдер на CSS
Перейти
Ещё одни красивые и анимационные чекбоксы
Перейти
Анимационный и красивый эффект для изображений
Перейти
CSS табы
Перейти
Анимационные блоки в стиле Flat
Перейти
Модальное окно с необычным и красивым эффектом
Перейти
10 бесплатных сниппетов CSS для создания красивых кнопок
Веб-дизайнерам сегодня не обязательно обращаться к Photoshop для создания красивых кнопок. С CSS3 можно манипулировать всем: от фонового градиента до тени, придавать кнопкам глянцевости или других степеней блеска.
Смотрите подборку 10-ти уникальных CSS сниппетов, с помощью которых вы сможете создать красивые кнопки для своего сайта.
1. Пластиковые кнопки
See the Pen CSS3 Buttons by Benjamin (@ben_jammin) on CodePen.
В сниппете CSS – чистый дизайн кнопок и все по делу. При множестве цветов и размеров, любая дорабатывается с легкостью. Дефолтные, отключенные, ряд кнопок работают как переключатели или табы. Самый чистый стиль, судя по CSS.
2. Cool Buttons
See the Pen Google Buttons by Tim Wagner (@timwagner) on CodePen.
Набор классные кнопок, немного отличающихся внешне от «пластиковых». Также просты в применении. Нет сияющего пластика в дизайне, но красиво реализован «push» эффект при клике. Из 6 заранее разработанных сценариев, можно выбрать цвет или кастомиизировать на свой вкус. CSS разделен на различные классы, что позволяет установить стиль кнопок по умолчанию одним классом, а альтернативный использовать для цвета.
3. Google кнопки
See the Pen Google Buttons by Tim Wagner (@timwagner) on CodePen.
В продуктах Google (Blogger, Drive или Gmail) кнопки имеют свой отличительный цвет. В наборе: эффектные гугл-подобные кнопки на чистом CSS3.
4. Bunch-o-Buttons
See the Pen EwDar by Alan Collins (@AlanCollins) on CodePen.Еще один пример глянцевого пластик-стиля от CodePen. Особенности кнопок в наборе: мульти-цветность с отличиями для малых, средних и больших размеров. Уникальная реализация переключений с глянцевости на flat в одном классе.
5. Социальные кнопки
See the Pen CSS social buttons and icons by Stan Williams (@Stanssongs) on CodePen.
Этот CSS сниппет, пожалуй, послужит исчерпывающей коллекцией красивых социальных кнопок с уникальной цветовой схемой & брендированными иконками. Стильность соц. кнопке придают степень и качество глянцевого градиента.
6. Jelly анимация кнопки
На первый взгляд обычна кнопка, но реагирует на клик очень специфичной анимацией. Помимо занимательного эффекта, впечатляет полуреалистичность тени. Меняя размер вслед за кнопкой, тень дополнительно подчеркивает действие пользователя, усиливая обратную связь. Подойдет для проекта с Call-to-Action, вроде стартапа или соц. медии.
7. Parallax кнопки
See the Pen Parallax 3D Button with JS controlled CSS variables by Tobias Reich (@electerious) on CodePen.
Впечатляющий CSS3-дизайн с использованием радиальных градиентов и довольно безумных оттенков. Фон, тени созданы исключительно на CSS. JavaScript добавили лишь для параллакс эффекта деформации. Это один из самых крутых примеров эффектно анимированной кнопки.
8. Hubspot пилюли
See the Pen Hubspot Red Pill — Blue Pill inset click buttons by Joe Henriod (@joehenriod) on CodePen.
Разработчик создал кнопку, вдохновившись стильным Hubspot дизайном. По функционированию она напоминает традиционные HTML-кнопки и построена на CSS классах, легко применяемых к любому элементу. Выбраны красный & синий цвета для 2 кнопок, напоминающих по форме пилюли – прямо как в Матрице. Вычурный стиль hover-эффекта просто цепляет внимание.
9. Кнопки в стиле Sexy
See the Pen Sexy SCSS buttons in HSB by Jeremy Thomas (@jgthms) on CodePen.
Большинство фронтэнд кодеров используют Sass/SCSS, т.к. это дает больший контроль и намного проще обычного CSS. Красивые SCSS-кнопки впечатляют своей детализацией с внутренними и внешними эффектами тени. Вы можете сменить цвет в одном классе или внести в сочетание свой оттенок. В hover состоянии кнопки выглядят как 3D, также как и при нажатии. Легко использовать для любого типа сайта и вообще можно конвертировать SCSS в CSS прямо в CodePen.
10. Кнопки в стиле Mozilla
See the Pen Single Element Mozilla-Buttons by Felix Schwarzer (@slimsmearlapp) on CodePen.
Mozilla провела основательный ребрендинг, сменив традиционно «пластиковый» стиль кнопок на своем сайте. Но вы можете украсить этими стилизованными по максимуму кнопками свой веб-ресурс. Красивые конус-формы реализованы полностью на CSS3: с фоновым градиентом и эффектом 3D фаски.
Больше стильных CSS3 кнопок
Рассмотренные 10 видов кнопок вы сможете кастомизировать в разных лейаутах. Они созданы на чистом CSS3: можно менять размер, цвет и стиль. Эти кнопки впишутся в современный проект, будь он бизнес / блоговой / соц. медиа или eCommerce тематики.
Если вы не нашли подходящий вариант для своего сайта, больший выбор красивых кнопок на CSS3 предоставит CodePen.