#efeito texto

Como Aplicar Sombra Personalizada em Texto

Neste vídeo eu vou te mostrar como usar personalização em textos no CorelDRAW. Vamos trabalhar em edição de cores e sombras. Efeitos diferenciado em objetos, desenhos e textos.

Vamos ao tutorial? Como aplicar sombras internas! Como Aplicar Sombra em Texto no CorelDRAW 2018 Como Aplicar Efeito Sombra e Personalização no CorelDRAW X6

  Curtem, Participem e Comentem. Arte no corel sempre…

Hoje a dica é um tutorial passo a passo de como criar efeitos e volume de papel cortado.

Esperamos que gostem e apliquem as dicas :) 

Assista abaixo o Tutorial completo com a técnica. 

Embora o vídeo esteja em inglês é possível habilitar a opção de legendas, mas é possível pegar as dicas assistindo o vídeo, seguindo o que é ensinado passo a passo.

Esse é praticamente o mesmo código que o do emboss, mas com uma pequena diferença. Não reparou a diferença? É o seguinte: o Emboss, seria como se fosse um botão e o Pillow Emboss, seria como se fosse o botão pressionado. Dá pra usar os dois efeitos pra brincar com o hover de menus e links, fica bem legal, coloquei eles assim nos testes >> (pagina de testes)

Nos exemplos, eu usei isso como base:

.pillow { padding: 10px; color:#corfonte; text-shadow: 1px 1px #cor1, -1px -1px #cor2; font-size: 24px; }

Dá pra brincar bastante com esse efeito, deixar ele tipo transparente. Eu fiquei brincando um pouquinho com ele na página de testes, e ficou bem legal. Fica quase que transparente, como uma marca d'agua. Explicando o código:

padding: 10px; // opcional, é o espaçamento entre o texto e a margem, é bom sempre usar, pra não ficar tudo coladinho.

color:#d2d8a4; // cor da fonte, coloque a mesma cor que o bg pra melhor efeito, pra deixar ~transparente~.

text-shadow: -1px -1px #cor1, 1px 1px #cor2; // a cor1 é a cor da primeira sombra, que seria a de cima da fonte, use uma cor mais escura da que você esta usando no bg e na cor2 uma mais clara, as vezes o preto e o branco não ficam legal.

font-size: 24px; // coloquei a fonte desse tamanho porque o efeito quase não aparece em fontes pequenas, aconselho que a sua fonte seja grossa e com mais de 20px.

Sabe o efeito emboss do Photoshop? É essa imagem ai do lado. Agora você pode usar também com o CSS nos seus themes, sem o uso de imagens. (Página de testes)

Código:

color:#ccc; text-shadow: -1px -1px white, 1px 1px #333;

E agora é colocar este código acima nas classes de css em que pretende usar. Nos exemplos, eu usei isso como base:

.emboss { padding: 10px; color:#corfonte; text-shadow: -1px -1px #cor1, 1px 1px #cor2; font-size: 24px; }

Dá pra brincar bastante com esse efeito, deixar ele tipo transparente. Eu fiquei brincando um pouquinho com ele na página de testes, e ficou bem legal. Fica quase que transparente, como uma marca d'agua. Explicando o código:

padding: 10px; // opcional, é o espaçamento entre o texto e a margem, é bom sempre usar, pra não ficar tudo coladinho.

color:#d2d8a4; // cor da fonte, coloque a mesma cor que o bg pra melhor efeito, pra deixar ~transparente~.

text-shadow: -1px -1px #cor1, 1px 1px #cor2; // a cor1 é a cor da primeira sombra, que seria a de cima da fonte, use uma cor mais clarinha da que você esta usando no bg e na cor2 uma mais escura, as vezes o preto e o branco não ficam legal.

font-size: 24px; // coloquei a fonte desse tamanho porque o efeito quase não aparece em fontes pequenas, aconselho que a sua fonte seja grossa e com mais de 20px.

Galera, achei um código super legal em CSS3, que não tem suporte em todos os navegadores, então talvez não funcione em algumas versões de navegadores mais antigos. Veja o efeito clicando aqui 

Gostou? E é bem simples o código.