Генераторы префиксов CSS3 свойств для разных браузеров (вендорные префиксы)

Встала задача для одного проекта прописать css3 свойства под различные брузеры, которые все еще работают только с указанием вендорных префиксов: -o, -moz, -webkit и -ms. Сейчас, конечно, все адекватные современные и обновленные браузеры большую часть свойств воспринимают и без вендорных префиксов, но надо и учитывать, что какие-то пользователи могут работать на старых версиях.

Таким образом я решил поискать генераторы, которые из моих нормальных css3 свойств сделают версию css с префиксами. Нашел 3 адекватных генератора.

Для примера я сделал совершенно не имеющий практического применения кусок css стилей:

.my_block {
 box-shadow: 5px 5px 10px -5px black;
 background: linear-gradient(90deg, #444, black 50%);
 box-sizing: border-box;
 transform: rotate(15deg);
 animation: 3s colorcycle infinite alternate;
 border-radius: 2px;
}

Первый довольно адекватный генератор - Prefixr от одного из авторов NetTuts+.

В нем можно отключить генерацию каких-то конкретных префиксов. Есть немного и других настроек. Кроме того, имеется API, которое поможет настроить, например, ваш Notepad++ для удобной работы с системой вендорных префиксов.
Код, который мне сгенерировал Prefixr выглядит так:

.my_block {
 -webkit-box-shadow: 5px 5px 10px -5px black;
 box-shadow: 5px 5px 10px -5px black;

 background: -webkit-linear-gradient(90deg, #444, black 50%);
 background: -moz-linear-gradient(90deg, #444, black 50%);
 background: -o-linear-gradient(90deg, #444, black 50%);
 background: -ms-linear-gradient(90deg, #444, black 50%);
 background: linear-gradient(90deg, #444, black 50%);

 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 -ms-box-sizing: border-box;
 box-sizing: border-box;

 -webkit-transform: rotate(15deg);
 -moz-transform: rotate(15deg);
 -o-transform: rotate(15deg);
 -ms-transform: rotate(15deg);
 transform: rotate(15deg);

 -webkit-animation: 3s colorcycle infinite alternate;
 -moz-animation: 3s colorcycle infinite alternate;
 -ms-animation: 3s colorcycle infinite alternate;
 -o-animation: 3s colorcycle infinite alternate;
 animation: 3s colorcycle infinite alternate;
 border-radius: 2px;
}

Летом этого года разработчик убрал поддержку префиксов для свойства border-radius.

Следующий генератор - CSSPrefixer.

Рассказать про него в принципе нечего, кроме того, что в нем нет никаких настроек. Главное с работой он своей справляется хорошо. Вот код, который сгенерировал он:

.my_block {
 -moz-box-shadow: 5px 5px 10px -5px black;
 -webkit-box-shadow: 5px 5px 10px -5px black;
 box-shadow: 5px 5px 10px -5px black;
 background: -moz-linear-gradient(90deg, #444, black 50%);
 background: -o-linear-gradient(90deg, #444, black 50%);
 background: -webkit-linear-gradient(90deg, #444, black 50%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #444), color-stop(1, black 50%));
 filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr=#444, EndColorStr=black 50%)";
 background: linear-gradient(90deg, #444, black 50%);
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 -moz-transform: rotate(15deg);
 -ms-transform: rotate(15deg);
 -o-transform: rotate(15deg);
 -webkit-transform: rotate(15deg);
 transform: rotate(15deg);
 animation: 3s colorcycle infinite alternate;
 -moz-border-radius: 2px;
 -webkit-border-radius: 2px;
 border-radius: 2px
}

Как видно из кода, этот генератор работаей добросовестней. Есть поддержка и border-radius и некоторых других свойств, которые не поддерживает тот же Prefixr.

Последний на сегодня генератор - PrefixMyCSS.

В генераторе имеются некоторые настройки. Выполняет он свою работу отлично. Вот код, который сгенерировал он:

.my_block{
/*box-shadow*/
-webkit-box-shadow:5px 5px 10px -5px black;
   -moz-box-shadow:5px 5px 10px -5px black;
        box-shadow:5px 5px 10px -5px black;
/*linear-gradient*/
background:-webkit-gradient(linear,50% 100%,50% 0,from(#444),color-stop(black,0.5));
background:-webkit-linear-gradient(90deg, #444, black 50%);
background:   -moz-linear-gradient(90deg, #444, black 50%);
background:     -o-linear-gradient(90deg, #444, black 50%);
background:        linear-gradient(90deg, #444, black 50%);
box-sizing:border-box;
/*transform*/
-webkit-transform:rotate(15deg);
   -moz-transform:rotate(15deg);
    -ms-transform:rotate(15deg);
     -o-transform:rotate(15deg);
        transform:rotate(15deg);
/*animation*/
-webkit-animation:3s colorcycle infinite alternate;
   -moz-animation:3s colorcycle infinite alternate;
    -ms-animation:3s colorcycle infinite alternate;
     -o-animation:3s colorcycle infinite alternate;
        animation:3s colorcycle infinite alternate;
/*border-radius*/
-webkit-border-radius:2px;
   -moz-border-radius:2px;
        border-radius:2px;
}

Код генерируется в довольно удобном формате, с отступами. Настройки же позволяют сразу же записывать свойства и значения без отступов, без комментариев и в одну строку.

Ну а каким пользоваться - решать вам.
Если вы знаете еще примеры автоматических генераторов css - пишите в комменты, с удовольствием про них напишу.