0 added
0 removed
Original
2026-01-01
Modified
2026-02-21
1
<p><a>#подборки</a></p>
1
<p><a>#подборки</a></p>
2
<ul><li>28 мар 2022</li>
2
<ul><li>28 мар 2022</li>
3
<li>0</li>
3
<li>0</li>
4
</ul><p>Готовые палитры, тестер сайта и копилка шрифтов.</p>
4
</ul><p>Готовые палитры, тестер сайта и копилка шрифтов.</p>
5
<p>Иллюстрация: Оля Ежак для Skillbox Media</p>
5
<p>Иллюстрация: Оля Ежак для Skillbox Media</p>
6
<p>Журналист, автор статей про моду, искусство и дизайн. Кастомизирует одежду и влюбляет людей в английский язык.</p>
6
<p>Журналист, автор статей про моду, искусство и дизайн. Кастомизирует одежду и влюбляет людей в английский язык.</p>
7
<p>Дизайнеры часто не рассматривают расширения для браузера как способ ускорить свою работу, проверить чужую или дать ценный комментарий. Но на деле среди них есть много полезных инструментов, которые помогут вам с дизайном сайтов.</p>
7
<p>Дизайнеры часто не рассматривают расширения для браузера как способ ускорить свою работу, проверить чужую или дать ценный комментарий. Но на деле среди них есть много полезных инструментов, которые помогут вам с дизайном сайтов.</p>
8
<p>Рассказываем о пяти расширениях для браузеров, которые стоит взять на вооружение.</p>
8
<p>Рассказываем о пяти расширениях для браузеров, которые стоит взять на вооружение.</p>
9
<p>Расширение позволяет распознать шрифты, их размер, межбуквенный интервал, высоту строки и цвет на любых сайтах.</p>
9
<p>Расширение позволяет распознать шрифты, их размер, межбуквенный интервал, высоту строки и цвет на любых сайтах.</p>
10
<p>Чтобы определить шрифт, нажмите на иконку расширения и наведите курсор на любую строку или заголовок. В появившейся подсказке вы увидите его название, кегль и HEX‑код цвета. В главном окне расширения также будет отображаться список всех шрифтов, которые есть на странице.</p>
10
<p>Чтобы определить шрифт, нажмите на иконку расширения и наведите курсор на любую строку или заголовок. В появившейся подсказке вы увидите его название, кегль и HEX‑код цвета. В главном окне расширения также будет отображаться список всех шрифтов, которые есть на странице.</p>
11
<p>Также у Font Ninja есть режим предпросмотра, чтобы проверить шрифт в разных начертаниях и размерах.</p>
11
<p>Также у Font Ninja есть режим предпросмотра, чтобы проверить шрифт в разных начертаниях и размерах.</p>
12
<p>Расширение позволяет сверить макет с готовым сайтом, чтобы найти в нём ошибки верстальщиков и разработчиков. Для этого нужно открыть сайт, запустить расширение и загрузить в него изображение-эталон.</p>
12
<p>Расширение позволяет сверить макет с готовым сайтом, чтобы найти в нём ошибки верстальщиков и разработчиков. Для этого нужно открыть сайт, запустить расширение и загрузить в него изображение-эталон.</p>
13
<p>В расширение можно добавить несколько изображений для сравнения. Также вы можете изменить их размер и непрозрачность.</p>
13
<p>В расширение можно добавить несколько изображений для сравнения. Также вы можете изменить их размер и непрозрачность.</p>
14
<p>Позволяет быстро узнать, какие цвета используются на сайте. Для этого запустите расширение, наведите указатель мыши на интересующие элементы страницы, и на верхней панели появится HEX-код цвета.</p>
14
<p>Позволяет быстро узнать, какие цвета используются на сайте. Для этого запустите расширение, наведите указатель мыши на интересующие элементы страницы, и на верхней панели появится HEX-код цвета.</p>
15
<p>В меню расширения есть инструмент, который даст доступ ко всем ранее найденным цветам.</p>
15
<p>В меню расширения есть инструмент, который даст доступ ко всем ранее найденным цветам.</p>
16
<p>Расширение для записи экрана. Обычно с помощью него демонстрируют пользовательские сценарии, фиксируют ошибки и комментируют работу. Перед началом съёмки можно выбрать необходимый формат - вкладка или окно. В личном кабинете готовое видео можно отредактировать.</p>
16
<p>Расширение для записи экрана. Обычно с помощью него демонстрируют пользовательские сценарии, фиксируют ошибки и комментируют работу. Перед началом съёмки можно выбрать необходимый формат - вкладка или окно. В личном кабинете готовое видео можно отредактировать.</p>
17
<p>Все ролики доступны по прямой ссылке - их можно отправлять коллегам и комментировать. Владелец ролика моментально получает уведомления о реакциях.</p>
17
<p>Все ролики доступны по прямой ссылке - их можно отправлять коллегам и комментировать. Владелец ролика моментально получает уведомления о реакциях.</p>
18
<p>Также во время записи можно включить микрофон и веб-камеру.</p>
18
<p>Также во время записи можно включить микрофон и веб-камеру.</p>
19
<p>Инструмент предназначен для визуального изменения любых элементов сайта. Выделите нужный объект на странице и переходите к редактированию его параметров в окне справа.</p>
19
<p>Инструмент предназначен для визуального изменения любых элементов сайта. Выделите нужный объект на странице и переходите к редактированию его параметров в окне справа.</p>
20
<p>YellowPencil позволяет изменить практически любые параметры CSS: шрифты, цвета, внешние и внутренние отступы, поля, границы и их радиус, положение элементов, выравнивание.</p>
20
<p>YellowPencil позволяет изменить практически любые параметры CSS: шрифты, цвета, внешние и внутренние отступы, поля, границы и их радиус, положение элементов, выравнивание.</p>
21
<p>С помощью инструмента можно легко вносить визуальные правки в лендинги или витрины виртуальных магазинов. Это удобно, если вы хотите показать разработчикам, как именно вы хотите поменять сайт.</p>
21
<p>С помощью инструмента можно легко вносить визуальные правки в лендинги или витрины виртуальных магазинов. Это удобно, если вы хотите показать разработчикам, как именно вы хотите поменять сайт.</p>
22
<p>YellowPencil доступен для<a>Chrome</a>.</p>
22
<p>YellowPencil доступен для<a>Chrome</a>.</p>
23
<p><strong>Больше инструментов для дизайнера</strong></p>
23
<p><strong>Больше инструментов для дизайнера</strong></p>
24
<a><b>Попробуйте бесплатно 4 топовые профессии в дизайне</b>Пройдите бесплатный курс по дизайну. Добавьте 4 крутых кейса в портфолио и решите, в каком направлении развиваться дальше. Пройти курс→</a>
24
<a><b>Попробуйте бесплатно 4 топовые профессии в дизайне</b>Пройдите бесплатный курс по дизайну. Добавьте 4 крутых кейса в портфолио и решите, в каком направлении развиваться дальше. Пройти курс→</a>