{"id":220273,"date":"2022-12-27T10:06:00","date_gmt":"2022-12-27T07:06:00","guid":{"rendered":"https:\/\/goodroid.mediadoma.com\/?p=220273"},"modified":"2022-11-10T18:48:07","modified_gmt":"2022-11-10T15:48:07","slug":"baixe-e-use-icones-de-design-de-material-gratuitos","status":"publish","type":"post","link":"https:\/\/goodroid.mediadoma.com\/pt-pt\/baixe-e-use-icones-de-design-de-material-gratuitos\/","title":{"rendered":"Baixe e use \u00edcones de design de material gratuitos"},"content":{"rendered":"<p>O Material Design do Google trouxe uma mudan\u00e7a dr\u00e1stica em seus servi\u00e7os com cores contrastantes e anima\u00e7\u00f5es interativas. Com a altern\u00e2ncia, vieram \u00edcones criados para combinar com o resto do ecossistema. O Google disponibilizou todos os \u00edcones gratuitamente em seus sites, aqui mostramos como baix\u00e1-los e us\u00e1-los.<\/p>\n<h2><strong>Baixe \u00edcones de design de materiais gratuitos<\/strong><\/h2>\n<p>Para baixar os \u00edcones tem\u00e1ticos do Material, acesse o <a href=\"https:\/\/design.google.com\/icons\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">reposit\u00f3rio<\/a> do Google. Role para baixo e voc\u00ea descobrir\u00e1 v\u00e1rios \u00edcones dispon\u00edveis para uso. Voc\u00ea pode pesquisar usando a barra de ferramentas ou selecionar o que voc\u00ea precisa rolando, o que obviamente consumir\u00e1 muito do seu tempo. Depois de fazer isso, uma barra horizontal aparecer\u00e1 na parte inferior contendo o nome do \u00edcone e algumas op\u00e7\u00f5es que voc\u00ea pode ajustar.<\/p>\n<p>Dica: Se voc\u00ea precisar baixar todos os \u00edcones do material, acesse este <a href=\"https:\/\/github.com\/google\/material-design-icons\/archive\/2.2.0.zip\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">link<\/a>.<\/p>\n<p>Voc\u00ea pode especificar o tamanho, se deseja um \u00edcone preto ou branco e, finalmente, pode baix\u00e1-los no formato SVG ou PNG. Infelizmente, existem apenas duas variantes de cores dispon\u00edveis. No entanto, voc\u00ea pode usar o Editor SVG para personalizar um \u00edcone SVG e alterar os tons para o mesmo.<\/p>\n<h2><strong>Altere a cor dos \u00edcones projetados pelo Material usando o Editor SVG<\/strong><\/h2>\n<p>Para modificar a cor do \u00edcone no editor SVG, clique no \u00edcone do balde na parte inferior e selecione a cor desejada. Toque na imagem do \u00edcone depois de import\u00e1-la do menu suspenso de edi\u00e7\u00e3o de SVG no canto superior esquerdo. Uma vez feito, exporte-o da mesma lista suspensa que vimos antes. Se voc\u00ea precisar editar \u00edcones localmente, voc\u00ea pode baixar o SVG atrav\u00e9s deste <a href=\"https:\/\/code.google.com\/archive\/p\/svg-edit\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">link<\/a>.<\/p>\n<p><a href=\"https:\/\/goodroid.mediadoma.com\/wp-content\/uploads\/2022\/08\/post-174017-62eee324098c6.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/goodroid.mediadoma.com\/wp-content\/uploads\/2022\/08\/post-174017-62eee324098c6.jpg\" alt=\"Baixe e use \u00edcones de design de material gratuitos\" ><\/a><\/p>\n<p>O Google publicou um guia detalhado para usar esses \u00edcones em sua <a href=\"https:\/\/google.github.io\/material-design-icons\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">p\u00e1gina do Github<\/a>. Ele tamb\u00e9m inclui detalhes de licenciamento, trechos de c\u00f3digo iOS\/Android para come\u00e7ar e alguns m\u00e9todos para implementar \u00edcones de material em seu site com exemplos.<\/p>\n<p>Isso foi tudo. Deixe-nos saber se perdemos algo na se\u00e7\u00e3o de coment\u00e1rios abaixo.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fonte de grava\u00e7\u00e3o:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/www.gtricks.com\" class=\"external external_icon\">www.gtricks.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Saiba como voc\u00ea pode baixar e usar \u00edcones de design de material gratuitos em seus aplicativos.<\/p>\n","protected":false},"author":1,"featured_media":174018,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[640,760],"tags":[],"class_list":["post-220273","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-em-geral","category-noticia"],"_links":{"self":[{"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/220273","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/comments?post=220273"}],"version-history":[{"count":0,"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/220273\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media\/174018"}],"wp:attachment":[{"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media?parent=220273"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/categories?post=220273"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/goodroid.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/tags?post=220273"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}