Подборка CSS3-генераторов для упрощения фронтэнд-разработки

Original author: Jean-Baptiste Jung
  • Translation
CSS3 предоставляет много новых возможностей в мире фронтэнд-разработки. Это действительно великолепная вещь, но иногда трудно вспомнить некоторые параметры, особенно, если вы — веб-дизайнер, а не программист. Вот 10 удивительных CSS3-генераторов, которые помогут вам сэкономить время и силы (картинки кликабельны).

CSS3 Generator


image
Этот генератор, безусловно, один из моих любимых, так как позволяют создавать более10 различных CSS3-эффектов, таких как закругленные углы, тень для текста, плавные переходы и многое другое.
css3generator.com

CSS Gradient generator


image
CSS градиенты это круто, но писать их вручную довольно сложно. Этот генератор поможет вам создать идеальный CSS-градиент, без головной боли.
colorzilla.com/gradient-editor

CSS button generator


image
На мой взгляд, это самый продвинутый CSS3-генератор кнопок, из доступных в Интернете. Настройте параметры, скопируйте сгенерированный код, и все готово!
css3button.net

CSS3Gen


image
CSS3Gen — хороший генератор, который позволяет вам легко создавать полезные фрагменты CSS3 и копировать их прямо в ваши проекты. CSS3Gen заботится обо всех префиксах для различных браузеров.
css3gen.com

CSS3 Please


image
CSS3 Please является очень эффективным инструментом для тестирования CSS3-кода: просто измените CSS-стили с помощью редактора, и специальный блок будет мгновенно изменяться, так что вы мгновенно сможете увидеть сделанные вами изменения.
css3please.com

Layer Styles


image
Если вы знакомы с Photoshop, нет никаких сомнений, что вам понравится Layer Style, генератор CSS3, повторяющий внешний вид популярной программы от Adobe.
layerstyles.org

Border image generator


image
Как вы можете догадаться, этот инструмент поможет вам создать красивые границы для изображений. Просто и эффективно!
border-image.com

CSS3 Pie


image
Internet Explorer уже десять лет является кошмаром верстальщиков, и, к сожалению, это закончится не скоро. Тем не менее, такие инструменты, как CSS3 Pie могут определенно помочь в создании IE-совместимого кода. Этот очень полезный генератор создает стили для Internet Explorer 6-9, способные отображать несколько наиболее полезных «украшательств» CSS3.
css3pie.com

CSS Easing Animation Tool


image
С помощью этого инструмента, у каждого разработчика теперь есть простой способ для создания CSS-анимации. Префиксы поддерживается, поэтому вам не придется беспокоиться о совместимости с различными браузерами.
matthewlein.com/ceaser

Font-Face generator


image
Хотите использовать причудливые шрифты на вашем сайте? Просто загрузите его на Font Squirrel Font-Face generator, и получите ваш CSS код, а также шрифт во всех форматах, необходимых для различных браузеров. Эта программа хорошо помогла в последние два года.
fontsquirrel.com/fontface/generator

Upd. 1 Подсказали еще неплохой CSS-генератор: css3.me

Similar posts

AdBlock has stolen the banner, but banners are not teeth — they will be back

More
Ads

Comments 23

    0
    Спасибо
      +2
      Ещё б всё это один сайт умел делать :-)
      • UFO just landed and posted this here
          0
          И куда же вы без -webkit-box-shadow на стареньких андроидах?
          • UFO just landed and posted this here
              0
              Не обязательно слабые, да и андроид 2.3 не так давно был на подавляющем количестве девайсов. Тем более, часто тени используются для одной лишь окантовки инпутов, когда делается inset shadow.
              • UFO just landed and posted this here
                  0
                  Как бы вам все пальцах-то объяснить популярнее? У вас заказчик тестирует версту на разных девайсах? У меня да.
                  • UFO just landed and posted this here
          0
          А никто не подскажет генератор вебкитовых скроллбаров?
          –2
          csstemplater.com должен быть первым
            +2
            CSS3 там ни при чем.
            +1
            Хех, примерно 85% ссылок фиолетовые
              0
              Может быть кому встречался сервис или утилита, которая может из psd стиль в css переводить?
              Не могу найти, но думаю это было бы то же полезным.
                0
                CSS Gradient generator может из картинки делать градиент
                  0
                  Divine Project умеет конвертировать PSD-шаблон в тему для Wordpress.
                    0
                    Вам сюда: csshat.com
                    0
                    Надо же, неожидал увидеть проект коллеги с NY (http://matthewlein.com/) на хабре :)
                      +3
                      Удивить мелкомягкими?
                      ie.microsoft.com/testdrive/Views/SiteMap/
                        +1
                        Удивили
                        0
                        css3ps.com/ – вот еще интересный генератор, но он в виде плагина к фотошопу.
                          0
                          Мы недавно запустили http://enjoycss.com.
                          Постарались собрать все самые лучшие фичи в одном месте
                          Оцените :) Ваш фидбек будет очень полезен для дальнейшего развития сервиса

                          Only users with full accounts can post comments. Log in, please.