Разное

Png иконка: Векторные иконки и стикеры — PNG, SVG, EPS, PSD и CSS

03.01.2023

Содержание

Automator: извлечение иконок приложений с сохранением в PNG-файлах

Зачем могут понадобиться иконки установленных приложений? Например, для красоты и наглядности в какой-нибудь презентации. Или в дизайнерской работе для создания, скажем, печатной продукции. Или в программистских делах для создания программ-твикеров или еще чего-нибудь этакого. Или просто для аватарки, если у вас есть любимая программа и вы ассоциируете себя с ней. В общем, извлечение программных пиктограм — задача не такая и специфическая. И справиться с ней проще простого.

Хозяйке на заметку. Иконки приложений в OS X можно выковырять вручную — делается это достаточно просто. Сначала выделяете приложение в окне Finder, затем жмете клавиши command+I — в окне свойств программы, щелкаете на ее значке в самом верху и жмете клавиши копирования command+C. Потом остается запустить утилиту «Просмотр» (Preview), нажать клавиши command+N и сохранить полученную картинку, желательно в формате PNG (если нужно сохранить полупрозрачные области иконки). Естественно, так удобно делать, если нужно извлечь одну-две иконки. Если же число требуемых значков гораздо больше — лучше все-таки воспользоваться возможностями «Автоматора».

Именно эту иконку нужно скопировать и вставить в утилиту «Просмотр», чтобы вручную сохранить значок в нужном графическом формате.

Итак, запускайте Automator, выбирайте пункт Служба (Service) в качестве типа нашего будущего процесса. В шапке, в выпадающем списке Служба получает выбранные (Service receives selected) выберите пункт файлы или папки (files or folders), а в списке рядом выберите приложение Finder. Таким образом мы ввели ограничение: наша служба будет доступна через контекстное меню только для папок и файлов и только в программе Finder — в любых других ситуациях соответствующий пункт меню виден не будет.

Теперь начнем составлять последовательность действий нашей службы.

1. Из категории библиотеки Файлы и папки (Files and Folders) перетащите действие Фильтровать объекты Finder (Filter Finder Objects). Внутри этого действия составьте правило фильтрования Тип — совпадает с — программа (Kind — is — application). Так мы отсеем все файлы и объекты, которые случайно затесались среди выделенных программ, но программами при этом не являются.

2. Теперь из категории Утилиты (Utilities) добавьте действие Запустить AppleScript (Run AppleScript), введя в этом действии такой код:
on run {input, parameters}
activate
return input
end run

Хозяйке на заметку. Действие Запустить AppleScript с таким кодом выполняет простую, но очень важную задачу: делает текущую службу активной, выводя ее окна на передний план. По какой-то причине это не происходит автоматически: допустим, следующим действием нашей службы будет отображение диалога открытия каталога — без выполнения указанного AppleScript-кода этот диалог может затеряться среди других открытых окон, что затруднит работу со службой. Попробуйте поэкспериментировать, отключив действие Запустить AppleScript и посмотрев, как при этом служба будет себя вести. Отсюда совет: если вы хотите гарантировать, что какое-либо диалоговое окно, созданное вашей службой, сразу оказывалось поверх остальных окон, применяйте действие Запустить AppleScript с таким кодом.

3. Третье действие — Запросить объекты Finder (Ask for Finder Items) из категории Файлы и папки (Files and Folders). С его помощью мы сможем впоследствии выбрать папку, куда службе следует сохранить извлеченные иконки. В свойствах действия укажите заголовок диалогового окна выбора каталога, задайте стартовую папку и укажите тип принимаемых данных — в соответствующем выпадающем списке выберите пункт Папки.

4. Теперь добавим в службу «интеллектуальное ядро» — действие Запустить shell-скрипт (Run Shell Script). Не меняя изначальных параметров действия, введите внутрь него такой код:
INPUT=("[email protected]")
INPUTAPPS=("${INPUT[@]:0:($#-1)}")
DESTINATION=${INPUT[($#-1)]}</p>

for APP in "${INPUTAPPS[@]}"
do
ICON=`defaults read "$APP/Contents/Info" CFBundleIconFile|sed -e 's/. icns$//'`
ICONFILE="$APP/Contents/Resources/$ICON.icns"
APPNAME=`basename "$APP" .app`
OUTFILE="$DESTINATION/${APPNAME}.png"

/usr/bin/sips -s format png "$ICONFILE" --out "$OUTFILE"
done


Если кому-нибудь интересно, в комментариях я смогу объяснить работу этого кода. Именно он получает на входе весь массив данных, отделяет пути выделенных в Файндере программ и путь к папке сохранения иконок, ищет внутри каждой программы иконку и сохраняет ее в указанном месте в формате PNG, присваивая картинкам имена соответствующих программ.

5. Если у вас установлена система визуального оповещения Growl, можно добавить последнее, пятое действие — Show Growl Notification, расположенное в категории Утилиты (Utilities). Введите заголовок (Title) и сообщение (Description), чтобы создаваемая служба могла наглядно сообщить об своем успешном выполнении.

Примерно так должна выглядеть готовая служба для извлечения иконок в русскоязычном варианте.

Все! Остается только сохранить службу под удобным для вас названием — например, Извлечь иконки из программ — и испытать ее в действии. Открыв окно Finder, перейдите в папку Программы (Applications), выделите несколько программ и, щелкнув на выделенных объектах правой кнопкой мыши, выберите в контекстном меню команду с названием только что сохраненной службы. Спустя несколько мгновений файлы будут сохранены в указанном месте, а Growl отобразит созданное вами сообщение.
*Деятельность Meta Platforms Inc. и принадлежащих ей социальных сетей Facebook и Instagram запрещена на территории РФ.

html — Где брать svg, png иконки и как их использовать для разных разрешений экрана?

Не могу найти иконку в svg, решаю добавлять ее через обычное png. Хочу сделать так, чтоб вне зависимости от разрешения экрана все смотрелось хорошо.

Вопрос: где именно искать версии картинок в 2x, 3x? Их дизайнер сам добавляет в макет? Или это ищешь самостоятельно?

  • html
  • css
  • svg
  • img

5

где именно искать версии картинок в 2x, 3x? Их дизайнер сам добавляет в макет? Или это ищешь самостоятельно?

PNG иконки

Если это иконки png, то достаточно много пакетов иконок в сети, где включены несколько папок с размерами 32. 64, 128, 256px

Если нужно, свою, родную иконку в нескольких вариантах размеров, то можно в Photoshop или в другом растровом редакторе сделать это. Буквально в несколько кликов, — нужно только выставить в меню изменения размеров требуемые цифры.

SVG иконки

Сначала ссылки на ресурсы, где достаточно много иконок и изображений SVG

  1. http://thenewcode.com/assets/svg/

  2. http://svg-whiz.com/svg/

  3. https://dev.w3.org/SVG/tools/svgweb/samples/svg-files/

  4. https://twemoji.maxcdn.com/svg/1f698.svg

В п.4 нет открытого каталога со списком иконок, но их можно посмотреть и скачать, если в браузерной строке поиска подставлять цифры с

300 до 699

https://twemoji.maxcdn.com/svg/1f301.svg

Пример, как использовать одну и ту же иконку с разными выводимыми размерами

Допустим вы скачали иконку андроида

Код иконки:

<svg xmlns="http://www. w3.org/2000/svg" viewBox="0 0 96 105">
  <g fill="#97C024" stroke="#97C024" stroke-linejoin="round" stroke-linecap="round">
    <path d="M14,40v24M81,40v24M38,68v24M57,68v24M28,42v31h49v-31z" stroke-width="12"/>
    <path d="M32,5l5,10M64,5l-6,10 " stroke-width="2"/>
  </g>
  <path d="M22,35h51v10h-51zM22,33c0-31,51-31,51,0" fill="#97C024"/>
  <g fill="#FFF">
    <circle cx="36" cy="22" r="2"/>
    <circle cx="59" cy="22" r="2"/>
  </g>
</svg>

Необходимо её немного доработать:

1.Обернуть код в тег <symbol>

  1. И далее, ей можно многократно использовать, вызывая командой <use>

        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 105" >
          <symbol viewBox="0 0 96 105"> 
         <g fill="#97C024" stroke="#97C024" stroke-linejoin="round" stroke-linecap="round">
            <path d="M14,40v24M81,40v24M38,68v24M57,68v24M28,42v31h49v-31z" stroke-width="12"/>
            <path d="M32,5l5,10M64,5l-6,10 " stroke-width="2"/>
          </g>
          <path d="M22,35h51v10h-51zM22,33c0-31,51-31,51,0" fill="#97C024"/>
          <g fill="#FFF">
            <circle cx="36" cy="22" r="2"/>
            <circle cx="59" cy="22" r="2"/>
          </g>
          </symbol> 
            
         <use xlink:href="#icon" x="0"  /> 
            <use xlink:href="#icon" x="25" />
              <use xlink:href="#icon" x="42 " /> 
                <use xlink:href="#icon" x="52" />
        </svg> 

Зарегистрируйтесь или войдите

Регистрация через Google

Регистрация через Facebook

Регистрация через почту

Отправить без регистрации

Почта

Необходима, но никому не показывается

Отправить без регистрации

Почта

Необходима, но никому не показывается

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

ИКОН | Организация клинических исследований (CRO) по разработке лекарств

Держите eCOA подальше от критического пути запуска клинических испытаний

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

Подробнее

Поставщики управляемых услуг

поставщиков управляемых услуг обеспечивают нашим предприятиям конкурентное преимущество, особенно в области языка и услуги переводчика.

Подробнее

Расширение масштабов коммерциализации CGT на переходном рынке

Рынок клеточной и генной терапии (CGT) быстро переход от ультра-нишевой науки к утвержденным методам лечения.

Подробнее

Передовой опыт производства, обработки и доставки клеточной и генной терапии

Клеточная и генная терапия (ККТ) предлагает многообещающие способы лечения ранее разрушительные и трудноизлечимые заболевания.

Подробнее

Разобраться со сложностью дизайна клинических испытаний CGT

В этом блоге будут рассмотрены некоторые проблемы клинических испытаний CGT. дизайн исследования, такой как набор пациентов и сбор данных, и стратегии подхода к ним.

Подробнее

Беспроблемный перевод медицинских и клинических исследований в постпандемическую эпоху

Пандемия Covid-19 продемонстрировала важность медицинских перевод как часто упускаемая из виду, хотя и необходимая услуга в мир наук о жизни и здравоохранении.

Подробнее

Проблемы клинической разработки передовых методов лечения редких заболеваний

Усовершенствованная терапия — это класс продуктов, основанных на генах, тканей или клеток, используемых для лечения или доставки лечения пациенты.

Подробнее

Усовершенствованная терапия редких заболеваний — нормативная дорожная карта

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

Подробнее

Диармейд Каннингем, главный административный директор и главный юрисконсульт, комментирует публикацию отчета ESG ICON за 2021 год

ICON опубликовала отчет ESG за 2021 год, в котором прогресс, которого мы добились в отношении наших приоритетов ESG, и обязательства.

Подробнее

Загрузки — Creative Commons

Для печатных публикаций следует использовать следующие файлы SVG, EPS и PNG. Пожалуйста, ознакомьтесь с нашей страницей политики для получения дополнительной информации о том, как могут использоваться наши логотипы. Логотипы и товарные знаки CC всегда следует загружать с этой страницы, чтобы обеспечить высокое качество. Загрузка с других сайтов может не соответствовать нашим стандартам и может привести к неправильному отображению или использованию наших защищенных логотипов и товарных знаков.

Векторные файлы SVG и EPS рекомендуются для использования в печатных материалах — файлы со стандартным разрешением экрана будут выглядеть размытыми или зубчатыми при использовании в печати. Есть ссылки на широкоформатные, высококачественные версии PNG каждого изображения для Интернета, печати, презентаций и видео.

Логотипы

Набор логотипов Akzidenz Grotesk Bold . Если он недоступен, вы можете использовать наш шрифт с открытой лицензией (лицензия CC BY-SA), CC Accidenz Commons . Загрузите его здесь.

Значки

Значки

Наклейки

Физические носители

Шесть лицензий для совместного использования вашей работы — простое и быстрое знакомство с лицензиями Creative Commons. Также доступен в виде сложенной брошюры.

Руководство по использованию общедоступных инструментов — простое и краткое введение в общедоступные инструменты Creative Commons. Также доступен в виде сложенной брошюры.

Три уровня лицензии (png). Также доступен в оттенках серого. (авторское право 2011 г., Creative Commons, Натан Йерглер, Алекс Робертс. Лицензия для общественности в соответствии с CC BY 3.0 Unported.)

Что такое Creative Commons? (Зеркало на scribd.com) — краткое введение, предназначенное для двусторонних печатных листовок на полстраницы.

Что такое Creative Commons? (Зеркало на scribd.com) — Полное введение, предназначенное для полностраничных распечаток.

Что такое Creative Commons? постер (зеркало на scribd.com) — постер большого формата.

Плакат «Как лицензировать» (Зеркало на scribd.com, исходные файлы Inkscape SVG) — плакат большого формата с объяснением наших шести лицензий.

Лицензирование и маркировка вашего контента (pdf) (Зеркало на scribd. com) — Полная распечатка страницы с информацией о маркировке контента CC.

Совместное использование комиксов Creative Works (Зеркало на scribd.com, исходные файлы Inkscape SVG) — общее введение в авторское право и лицензирование CC.

Поощрение экологии творчества (pdf) (Зеркало на scribd.com) — История и идеология Creative Commons.

Видеозаставки

Видеозаставки Creative Commons
Мы создали их вместе с графическим дизайнером/иллюстратором Райаном Джунеллом. Не стесняйтесь использовать их в своих видеороликах о Creative Commons или помечать свои видео лицензией CC или инструментом общественного достояния по вашему выбору.

Анимированные GIF-файлы

Creative Commons Logo Color Pop

Щелкните правой кнопкой мыши анимацию выше, чтобы сохранить ее на локальное устройство. Вы можете свободно использовать собранные здесь анимации, чтобы продемонстрировать свою поддержку CC, поскольку они являются общественным достоянием в соответствии с CC0.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *