# Uso

Nesta seção veremos as 6 tags de cabeçalho, como usar a paleta de cores e classes que podem ser usadas como alinhar texto à direita, centralizar e etc...

Tags de cabeçalhos

Header h1

Header h2

Header h3

Header h4

Header h5

Header h6

Alinhamento de texto

Texto à direita

A classe right alinha o texto à direita.

texto à direita


<div class="card right">texto à direita</div>

Texto à esquerda

Por padrão todo texto é à esquerda, porém, caso precise a classe left alinha o texto à esquerda. A mesma pode ser omitida.

texto à esquerda


<div class="card left">texto à esquerda</div>

Texto centralizado

A classe center centraliza o texto

texto centralizado


<div class="card center">texto centralizado</div>

Texto justificado

A classe justify alinha o texto de forma justificado

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent viverra pharetra eros, ac luctus lacus pulvinar eu. Sed hendrerit volutpat purus, sagittis lobortis mi aliquam ac.


<div class="card justify">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent viverra pharetra eros,
  ac luctus lacus pulvinar eu. Sed hendrerit volutpat purus, sagittis lobortis mi aliquam ac.
</div>

Espessura da fonte

Espessura leve

A classe t-light torna a espessura da fonte leve. Esse tipo de fonte é a padrão mais podem ser usada em elementos como os de cabeçalho.

H1 normal

H1 t-light


<div class="card">
  <h1>H1 normal</h1>
  <h1 class="t-light">H1 t-light</h1>
</div>

Espessura regular

A classe t-regular torna a espessura da fonte um pouco mais forte que a leve.

Fonte regular


<div class="card t-regular">Fonte regular</div>

Espessura negrito

A classe t-bold torna a espessura da fonte negrito.

Fonte negrito


<div class="card t-bold">Fonte negrito</div>

Cor da fonte

Alterando a cor da fonte

Para alterar a cor da fonte, basta adicionar antes do nome da cor ( ver Paleta de cores ) o prefixo t- como por exemplo t-green.

Texto com a classe t-green


<div class="card t-green">Texto com a classe t-green</div>