Домой / Online-инструменты / Online CSS-инструменты

Online CSS-инструменты

Онлайн генератор CSS3 кода

CSS3 Generator — это онлайн сервис для создания стилей CSS3 для HTML элементов с помощью простого и понятного визуального редактора некоторых свойств. Правила, которые можно изменять включают: border, border-radius, box-shadow, background (градиенты) и opacity. Почти каждое свойство имеет возможность для детальных установок, например, можно определить разные значения border-radius для каждого угла,  установить внешнюю или внутреннюю тень для box-shadow. Приложение в реальном времени отображает все изменения на элементе предварительного ... Читать далее »

Онлайн сервис для проверки CSS кода

CSS Lint — онлайн сервис, который поможет найти ошибки и проблемные места в коде CSS. Код CSS копируем в поле текстового ввода на странице сервера и жмем кнопку «LINT!». После проверки сервис загружает страницу со списком ошибок и предупреждений. В списке указаны номера строк, в которых были найдены проблемы, и описание. Читать далее »

Онлайн генератор кода CSS3 для кнопок

Button Maker — веб сервис для визуального формирования кнопки с использованием CSS3. Завершив подбор параметров, нажимаем на саму кнопку и копируем сгенерированный код в свой проект. Просто, наглядно, быстро. Читать далее »

Онлайн сервис для генерации линейных фонов

Обычно для создания линейчатого фона страницы генерируется изображение и затем присоединяется в качестве фоновой картинки к элементу средствами CSS. Patternizer использует другой подход к созданию и использованию линейчатых фонов. Онлайн редактор позволяет визуально спроектировать дизайн фона с использованием различных линий, задавая их цвет, ширину, прозрачность, угол поворота и смещение. Затем генерируется код, который содержит переменные для библиотеки JavaScript (patternizer.js) для построения ... Читать далее »

Онлайн сервис для генерации кода CSS индикатора загрузки

CSSload — онлайн сервис, который генерирует код CSS для формирования индикатора загрузки без изображений. Для выбора доступны 8 типов индикаторов. Можно задавать цвет, размер и скорость анимации. В коде используются анимации, переходы и трансформации CSS3. Читать далее »

Онлайн сервис для настройки параметров анимации трансформации CSS3

Трансформации CSS3 открывают замечательные перспективы для построения динамичных и привлекательных интерфейсов. Широкий выбор стандартных функций графика перехода (ease, linear, ease-in, ease-out и ease-in-out) может быть существенно расширен настраиваемым вариантом cubic-bezier. Но выбор параметров для функции cubic-bezier может потребовать значительных затрат по времени и многочисленных проб.CSS cubic-bezier Builder — сервис, который предоставляет визуальный редактор для формирования кривой с помощью наглядных инструментов. полученный ... Читать далее »

Генератор спрайтов CSS

Спрайты CSS — отличный инструмент веб мастера. Но их подготовка может отнимать много драгоценного времени. SpritePad — веб приложение, которое существенно ускоряет процесс за счет автоматической генерации кода CSS для использования спрайта. Размер итогового изображения можно изменять. Размещать нужные части спрайта нужно с помощью технологии «перетащи и брось». По завершении работы с изображениями генератор предоставляет разработчику zip-архив с готовым спрайтом и правилами CSS ... Читать далее »

Онлайн генератор стрелок на CSS

В сети существует большое количество онлайн генераторов для различных элементов веб сайта: индикаторов загрузки, кнопок, различных фонов и прочих нужных фишек. CSS Arrow Please — сервис, который предлагает инструмент для создания стрелок на CSS3. Пользователю предлагается установить положение стрелки и ее цвет, а также параметры рамки. Готовый CSS код используем по своему усмотрению. Читать далее »

Конвертор CSS в LESS

Для тех разработчиков, которые начинают свое погружение в мир LESS из реалий CSS наверняка придется по вкусу онлайн сервис Css2Less. С его помощью можно конвертировать код CSS в LESS простым копированием текста со стилями. Инструмент основан на использовании библиотеки Ruby css2less. Кроме того, исходный код сайта можно использовать для создания подобного сервиса на своем сетевом ресурсе. Читать далее »

Адаптивная модульная сетка CSS с библиотекой элементов

Gumby — адаптивная модульная сетка CSS, которую можно настроить для любого разрешения экрана практически без усилий. Шаблон автоматически оптимизируется для настольных компьютеров и мобильных устройств. Gumby также включает библиотеку элементов интерфейса — кнопки, формы, навигацию и закладки. Также в состав пакета включается небольшой JavaScript код, который реализует функционал библиотеки. На сайте проекта имеется несколько вариантов загрузки: 12 колонок, 16 колонок, гибридный ... Читать далее »