Como criar um ícone do aplicativo no Illustrator

Sep 11, 2025

Como

Pagina 1 de 2:

Como criar um ícone do aplicativo no Illustrator: Etapas 01-11

Como criar um ícone do aplicativo no Illustrator: Etapas 01-11
Como criar um ícone do aplicativo no Illustrator: Etapas 12-23

Nisso Tutorial do Illustrator. , Mostrarei como criar um ícone de aplicativo de calculadora no Adobe Illustrator CC. . Usaremos ferramentas de forma diferente, ferramenta de caneta, juntamente com os recursos 3D do Illustrator. Espero que você aprenda algumas dicas úteis ao longo do caminho.

Você também precisará baixar um par de fontes grátis Para este tutorial: DS-Digital. e Bebas Neue. . Se você ainda não tem, você pode obter Adobe Creative Cloud aqui .

Mas primeiro, vamos dar uma olhada no resultado final:

01. Abra um documento

illustrator font icon — Clique na imagem para ampliar

Crie um novo documento no Illustrator com Largura de 600px e altura de 450 px.

02. Crie o plano de fundo

illustrator app icon — Clique na imagem para ampliar

Selecione a ferramenta retangular (m) e escolha # 44484d. Preencha a cor para desenhar um retângulo cobrindo a tela como o fundo.

03. Faça a base

Vamos começar criando a base do ícone. Portanto, selecione a ferramenta Retângulo (m) e clique na janela de exibição de tela para exibir opções. Digite a largura de 280px, a altura de 265px e pressione OK para desenhar um retângulo conforme mostrado abaixo. Escolher # E7ded0. como a cor de preenchimento.

Em seguida, vamos convertê-lo em um retângulo arredondado. Selecione este retângulo com a ajuda da ferramenta de seleção (v) Orby clicando no alvo em forma de anel presentes no lado direito da respectiva camada. E ir para o efeito & gt; Estilizar e gt; Cantos arredondados. Digite 50px para o raio e pressione OK.

Click image to enlarge — Clique na imagem para ampliar

04. Definir efeito

Selecione este retângulo e vá para efeitos e GT; 3d & gt; Extrusão e amp; Bisel. Aplique as configurações dadas aqui.

05. Aplique um gradiente

Para aplicar gradiente sutil sobre a base, desenhe um retângulo cobrindo toda a forma 3D usando qualquer cor de preenchimento. Agora convertê-lo em um retângulo arredondado com 50px de raio de canto.

Agora substitua seu preenchimento com um gradiente preto-branco-preto usando a ferramenta Gradient (G). Altere seu modo de mesclagem para queimar cores com 20% de opacidade no painel de transparência (Shift + Ctrl + F10).

06. Crie outro retângulo

Em seguida, desenhe outro retângulo com largura de 280px e altura de 178px usando a cor de preenchimento # E9E3D9 e o curso de cor branca. Escolha o peso do curso 1PT da barra de controle superior.

Agora convertê-lo em um retângulo arredondado pelo raio 40px.

Depois disso, aplique a seguir gradiente nele e altere seu modo de mesclagem para multiplicar com 50% de opacidade no painel de transparência (Shift + Ctrl + F10).

07. Faça retângulo arredondado

Desenhe outro retângulo de 230px com e 35px altura usando a cor de preenchimento # BCBA95 e para acidente vascular cerebral aplique luz ao gradiente cinza escuro, conforme mostrado abaixo. Selecione o peso do AVC do 3PT da barra de controle superior.

Converta este retângulo em um retângulo arredondado pelo raio de canto 10px.

08. Faça um efeito de brilho

Em seguida, selecione este novo retângulo e vá para a janela & GT; Aparência para visualizar o painel de aparência ou pressione Shift + F6. Agora selecione o atributo de preenchimento e clique no ícone do item selecionado duplicado na parte inferior do painel de aparência para duplicar o preenchimento. E substituir este novo preenchimento com preto e amp; Gradiente branco a 90 graus como mostrado acima.

Mantenha este retângulo selecionado e vá para o efeito & GT; Estilizar e gt; Brilho interior. Aplique as configurações dadas aqui. Depois de terminar, altere o modo de mesclagem de preenchimento de gradiente para multiplicar com 30% de opacidade.

09. Copie o retângulo.

Selecione este novo retângulo e pressione Ctrl + C para copiar e pressionar Ctrl + B para colar nas costas. Arraste esta cópia 1-2 passos para baixo. Agora, remova seus atributos de preenchimento arrastando-os para excluir o ícone na parte inferior do painel de aparência e dar-lhe um curso de 3pt # D1D2D4. cor.

10. Adicione o texto

Em seguida, adicionaremos algum texto pela tela. Escolha a ferramenta Tipo (t) para digitar o texto usando # 404041. Preencha a cor. Eu usei a fonte DS-Digital aqui.

Agora pressione Ctrl + C para copiar e pressione Ctrl + B para colar nas costas. Arraste o texto copiado 1-2 passos para baixo e mude sua cor de preenchimento para # 808284. .

11. Faça a base

Em seguida, criaremos a base do botão. Selecione a ferramenta Retângulo para desenhar um retângulo com as seguintes dimensões usando # 847d72. Preencha a cor e mesma luz para gradiente cinzento escuro no acidente vascular cerebral, conforme usado no passo 7. No entanto, escolha o peso do curso 1PT aqui.

E convertê-lo em um retângulo arredondado pelo raio de 25px.

Depois disso, duplique seu atributo de preenchimento no painel de aparência e aplique Black & amp; Gradiente branco a 90 graus. Altere seu modo de mesclagem para multiplicar com 50% de opacidade.

Próxima Página: As etapas finais para criar um aplicativo de ícone no Illustrator ...

Pagina atual: Como criar um ícone do aplicativo no Illustrator: Etapas 01-11

Próxima página Como criar um ícone do aplicativo no Illustrator: Etapas 12-23

Como criar um ícone do aplicativo no Illustrator

01. Abra um documento

02. Crie o plano de fundo

03. Faça a base

04. Definir efeito

05. Aplique um gradiente

06. Crie outro retângulo

07. Faça retângulo arredondado

08. Faça um efeito de brilho

09. Copie o retângulo.

10. Adicione o texto

11. Faça a base

Como - Artigos mais populares

Criar um efeito de anaglyph do Old School

Comece com Redux Thunk

10 dicas para masterizar as fotos da Apple

Como trazer um personagem 2D para a vida em VR

Como pintar como um mestre do século XIX

Como remover um fundo no Photoshop

Espalhar árvores com V-Ray

Como fazer texturas deliciosas com lápis

Categorias