![](https://habrastorage.org/storage/habraeffect/bf/22/bf223da6beabe61c2d6aab8344062547.png)
1. Wordmark.it
![](https://habrastorage.org/storage/habraeffect/21/45/2145a679b4d4edb2ee8e1d78f560c899.png)
Сервис для подбора шрифтов Wordmark.it — позволяет увидеть написание заданной фразы со всеми шрифтами, установленными на вашем компьютере. Шустро грузит, удобные фильтры. Жаль, нет возможности задать цвета фона и букв.
2. Spritebox
![](https://habrastorage.org/storage/habraeffect/62/f1/62f133e811a8df62ab1dd145cc30e2c1.jpg)
Спрайтбокс предназначен для «нарезки» картинок на спрайты. Загружаете картинку, выделяете нужные области, пара кликов — и у вас есть готовые css-стили для спрайтов.
CSS-спрайты — это представление большого количества мелких картинок, путем создания одной большой картинки, что существенно экономит время загрузки и ресурсы сервера (запрос идет всего-лишь на одну картинку, вместо всех).
3. CSS3 Generator
![](https://habrastorage.org/storage/habraeffect/7a/d8/7ad805dc25688c75ac009fc59e46b95a.png)
CSS3 Generator поможет вам грамотно использовать возможности CSS3: покажет список доступных CSS3-стилей, сгенерирует кроссбраузерный код для них, сообщит о том, какие браузеры поддерживают или не поддерживают данные стили.
4. ProCSSor
![](https://habrastorage.org/storage/habraeffect/9f/44/9f44f4114b38f152cc96df3a888ed59f.png)
ProCSSor — инструмент для проверки/форматирования css-стилей. Загружаете свой styles.css, выбираете настройки форматирования и получаете на выходе красивый валидный css-код.
5. Super Conversion Button
![](https://habrastorage.org/storage/habraeffect/21/75/2175798be27cd74ebd664f69a9fa4879.png)
Super Conversion Button — инструмент для быстрого создания дизайнов кнопок. Просто выбираете стили, цвета, текст надписи и т.д.
6. 0 to 255
![](https://habrastorage.org/storage/habraeffect/18/7f/187f7aad2de41f109874f973c98c9a57.png)
0 to 255 — простой и удобный сервис подбора оттенков цветов. Думаю, по скриншоту все и так понятно.
7. Frame Box
![](https://habrastorage.org/storage/habraeffect/d3/52/d352b2b49e9e6286f87fc53aa5419526.png)
Frame Box — сервис для создания так называемых «wireframes» — структурных схем таблиц. Очень полезная вещь на стадии проектирования разметки новых сайтов или каких-либо веб-интерфейсов. Созданные схемы можно сохранять, а также делиться ссылками на них.
8. jsFiddle
![](https://habrastorage.org/storage/habraeffect/80/4b/804b57f33c9422b8c2853d4e1f135a22.png)
Сервис jsFiddle — эдакая «песочница» для веб-разработчиков. Рабочая часть окна разделена на 4 части: HTML, CSS, JavaScipt и результат. В меню слева выбираем js-фреймворк, библиотеки к нему, спецификацию HTML и т.д. В соответствующих частях рабочей области пишем код — и незамедлительно видим готовый результат. Проекты можно сохранять и делиться ими.
Подборка сервисов взята отсюда, спасибо за внимание, надеюсь, статья была полезной.
Альтегрип — Инфоред — Сеплэйс