Архив тега: градиенты

На странице собраны все публикации по тегу «градиенты».

Создаем красивый градиент фона + трансформация skew в CSS3

Ранее в блоге мы уже рассказывали про линейные градиенты и заодно приводили примеры разных сервисов-генераторов. Сегодня попробуем применить эти знания на практике для создания красивого градиента фона на CSS. Плюс в процессе работы познакомимся с интересной функцией skew для реализации трансормаций в CSS3. Можно сказать, что основная идея фонового изображения позаимствована с сайта компании BrightMedia, который является прекрасным примером профессионального использования всех возможностей CSS3. Правда, мы не будем повторять один в один реализацию фона с данного проекта, а попробуем воссоздать нечто отдаленно похожее. Во-первых, […]

Нет комментариев

Линейные градиенты в CSS и генераторы градиентов

Градиентом называют плавный переход из одного цвета к другому. Когда-то этот прием был достаточно популярен для сайтов в стиле веб 2.0. Помнится, многие дизайнеры применяли яркие градиенты для создания красочных логотипов, дизайнов сервисов и т.п. В настоящее время с помощью CSS3 данную фишку можно реализовать без каких-либо картинок, фотошопа, а используя только стили CSS. Я уже как-то писал про градиентные кнопки CSS3 сегодня поговорим про градиенты чуть более детально. Линейные градиенты — самая простая реализация. При их создании используется функция […]

Нет комментариев

Создаем красивые кнопки для сайта на CSS3 (с градиентами)

Каждый веб-мастер давно наслышан, а кто-то уже виртуозно применяет на практике новые уникальные возможности CSS3. Не так давно мы разбирали несколько интересных текстовых эффектов, на этот раз речь пойдет о градиентных кнопках, созданных без использования графики (картинок), то есть, только средствами CSS3. Сам туториал я обнаружил здесь, вам же предлагаю перевод. Итак основные качества будущей кнопки (кнопок): Масштабируемость (в зависимости от размера шрифта и количества текста); Функциональность, юзабилити (предусмотрены состояния кнопки — hover эффект при наведении, а также normal и […]

комментариев 8

Бесплатные градиенты для фотошопа

Градиенты — это один из наиболее важных аспектов, которые нельзя забывать при разработке веб-сайта 2.0. Предлагаю вам скачать отличную подборку из 130 потрясающих градиентов в одном файле в формате GRD для Adobe Photoshop. Эти градиенты полностью масштабируемы в том смысле, что вы можете достаточно просто создать форму или использовать готовые формы shapes для Photoshop, а потом применить на них тот или иной градиент. С помощью этих веб2.0ных градиентов можно создавать оригинальные логотипы, фоны, кнопки. Вот, например, советую почитать мою статью […]

комментариев 7