[ Como fazer textos coloridos/em degradê no tumblr!]
Faz tempo que queremos fazer um tutorial assim, mas fica uma jogando pra outra e nunca é feito. Então resolvi fazer, de uma vez por todas, uma ask sobre apareceu do buraco negro que é nossa inbox e me fez lembrar do pedido. Eu sei que o tumblr oferece uma seleção de cores, mas elas são fortes e algumas não são boas para leitura (estou falando de você, senhor amarelo); só que o que vou ensinar aqui vai permitir que qualquer letra fique colorida e na cor que estiver no seu coração! Vou ensinar dois jeitos para fazer um texto colorido e personalizado, é uma boa opção para aqueles que gostam de combinar letra + cor do theme.
Antes de começarmos, creio ser importante comentar que apesar de bonito, fontes coloridas/degradê, como as que vou ensinar, não são lidas em alguns leitores de tela - que são utilizados por pessoas com deficiência visual -, segundo esse post, invés de ler as palavras ou frase normalmente, alguns leitores (talvez não todos) vão soletrar letra por letra e pode se tornar difícil entender. Por que estou falando disso? Achei interessante deixar as pessoas cientes! E tem um meio de “melhorar isso”, que é colocando a tradução embaixo sem qualquer fonte, como não uso leitores de tela, infelizmente não sei como funciona, mas é bom ficar informada.
Agora vamos ao nosso tutorial de hoje!
FAZENDO FRASES EM DEGRADÊ!
Você precisa entrar nesse site, porque ele vai te ajudar a fazer um texto com muitas cores! A interface não mostra muito, mas tem o necessário para o que vamos fazer e não, você não precisa entender horrores de HTML para mexer nele, tanto que vou te ensinar o básico, caso deseje adicionar mais cores.
Como pode ver, temos o código e esse quadrado branco, que contém dois retângulos em vermelho e verde. Se você quiser fazer com apenas duas cores, pode pular o que vou ensinar, mas se quiser colocar outras cores, me acompanhe. Digamos que você quer um degradê com quatro cores, mas o código só nos dá duas opções, o que fazer? Simples, veja o print abaixo.
Perceba que aumentei duas linhas entre a “first” e a “last” no código, tanto que notifiquei com as setas vermelhas. Para ter mais opções de cores, você precisa aumentar as linhas, ou seja, como quero quatro cores, adicionei uma linha como “second” e outra como “third” (precisa ser em inglês); só copiar as linhas já existentes, dar um espaço e colar e, claro, mudar os “títulos”. Mas veja que mesmo mexendo no código, continuamos apenas com dois quadrados coloridos e para que o code seja atualizado, você deve apertar no “Run” no menu acima.
Vai atualizar e surgir os quatro campos que desejamos. Eu tentei até dez quadrados de cor e foi, não sei o limite, mas creio que ninguém vai querer um degradê com tantas cores, espero né… Se quiser fazer as cores do arco íris, por exemplo, basta adicionar até o “sixth” e deixar o “last” que vai contar como a sétima cor.
Voltando ao nosso exemplo, com quatro cores, para selecionar as mesmas é só clicar no retângulo e selecionar a cor que desejar. Você pode usar o cursor e ir optando pela cor desejada, mas se você tiver o “code” da cor, só selecionar o “HEX” e colar o código ali. E para chegar no HEX, só clicar duas vezes no “R G B”.
Selecionei essas cores de exemplo e adicionei o texto que desejo, tudo na linha de cima. Não sei se tem limite de caracteres, porque, normalmente, uso apenas para frases pequenas, fica por sua conta em risco tentar. Depois do texto escrito e as cores escolhidas, clique em RUN para que o código apareça na segunda linha (em vermelho no print), você clica ali e dá um ctrl + a e ctrl + c para copiar; agora vamos para o tumblr. Crie uma nova postagem e mude o editor atual para o editor HTML, não vamos mudar de BETA para LEGACY ou vice e versa (nem sei se dá mais). Siga o que indico na imagem abaixo:
Ao selecionar o editor HTML, nós vamos ter essa interface:
Eu prefiro apagar esse código que aparece, porque dá para editar depois. Depois de apagar, você só precisa colar o código do site ali e antes de salvar, dê uma olhada antes, só mudar de HTML para VISUALIZAR. Se o texto ficou colorido, deu certo! Então pode voltar para o Rich Text de novo e ser feliz. Mas Rinn, eu quero colocar em itálico ou em qualquer formatação do tumblr, como faço? Como faz normalmente com os textos comuns, não vai interferir no degradê.
USANDO APENAS UMA COR!
Você não quer fazer um degradê e não gosta das cores disponibilizadas pelo tumblr, mas ainda quer colocar cores em seu blog? Não tem problema, nós conseguimos também! Você pode usar o site que indiquei, só deixar apenas uma linha ou as duas iniciais, colocando a mesma cor em ambos os retângulos; mas quando quero usar uma cor só, uso um carrd chamado ROLEPLAY FORMATTER! que além de colocar cores, também ajuda a formatar uma resposta para thread - ou para o que quiser.
Essa é a interface do formatador, não vou me apegar em como formatar as coisas, se quiserem, posso ensinar depois, hoje vamos falar de cores. Muito simples, você vai clicar onde circulei para aparecer a paleta de cores, infelizmente não temos muitas opções, então só clicar em “Mais Cores” para abrir essa tela.
Não tem opção diferente, mas se quiser escolher alguma das colocadas ali, fique à vontade. Normalmente, eu procuro as cores em código em um site que gosto muito. Pesquiso HTML Colors no google e vou no segundo site sugerido, porque acho ele mais fácil de mexer.
Como na imagem, temos esse hexágono com muitas cores; a cor escolhida e como ela fica em bold e afins + seu código em HEX, RGB e HSL; e por fim, a paleta dessa cor com cores mais claras ou escuras. É dali que você pode tirar a cor que deseja e clicando na mesma, vai aparecer como ela fica nas especificações de bold/italic. Quando encontrar a cor que deseja, copie o código dela e cole no segundo retângulo da aba aberta no carrd de formatar - se não copiou a # junto, não esqueça de colocar na frente - e depois só clicar em ok. A cor fica salva para ser utilizada, então você precisa escrever o que deseja e selecionar tudo para adicionar a cor, fazendo o básico, clicando na opção texto (A) e selecionando a cor escolhida.
Como podem ver, selecionei o texto e depois a cor que queria, se quiser adicionar itálico ou bold, fique a vontade, só usar o que está destacado em rosa claro. Se quiser deixar em small, só clicar onde destaquei em roxo e selecionar a opção. Mas como vamos manter a cor pra colocar no tumblr? Simples, sigam esses passos.
Aperte em “CÓDIGO FONTE” para transformar em HTML, assim vamos ganhar essa “equação” de code, onde: <p> é o começo do código, <i> é o itálico, <b> é o negrito/bold, <small> é para a letra ficar pequena e o <span style=”color: #tantantan”> corresponde a cor que foi selecionada. Dá aquele ctrl + a e ctrl + c esperto e vamos para o tumblr, só repetir o passo referente ao aplicativo no tópico acima e pronto! Agora você tem uma cor diferente na sua dashboard e pode ser feliz.
Acabamos nosso tutorial por aqui e eu espero que tenha sido bom para ajudar alguém, inclusive, esse é o resultado final, em rosa temos o primeiro jeito e em vermelho temos do segundo jeito.
romaincrisis
germansingergirl
theartofmadeline
kaledo-art
jacobvanloon
dailybridgerton
discoholicmusic
dededos
janainaart
