Cores Cores | Bacgrounds | Textos

Cores Padrões

.B{cor}(0|29) = Background - Colores Padrões e efeitos.

Ex.: Principal | Secundária | Sucesso | Infor | Alerta | Perigo | Claro | Noturno
Ex.: .Bprin | .Bsecu | .Bsuce | .Binfo | .Baler | .Bperi | .Bclar | .Bnotu

.B{cor}(hover) = Cor Principal e Hover
Ex.: .Bprin | .Bprin-hover

.B{cor}(1|25) = Background - Cores Degrade e Efeitos.
Ex.: .Bprin1 | .Bsuce5 | .Bnotu22

.B{cor}(26|29) = Background - Opacidade.
Ex.: .Bprin26 | .Bsuce29 | .Bnotu28

Trabalhamos com 4 tipos de Opacidade: 10%, 25%, 50%, 75%.
Todos depois de 16 é opacidade: 17: 10%, 18: 25%, 19: 50%, 20: 75%

              
                
                    <span class="Bprin1">
                        Bprin1
                    </span>
                    <span class="Bsecu7">
                        Bsecu7
                    </span>
                    <span class="Baler25">
                        Baler25
                    </span>
                    <span class="Bperi8">
                        Bperi8
                    </span>
                    <span class="Bclar6">
                        Bclar6
                    </span>
                
              
            

Degrades

.B{color(0|20)} dg(1|12) = Background-Color Degrade;
Ex.: .Bcinz dg10 | .Bamar deg5 | .Bprincipal5

Cores

preto, branco, neutro, pedra, cinza, gold, amarelo, laranja, coral, vermelho, marron, marron, brown, olive, limão, verde, turqueza, cian, céu, teal, azul, índigo, navy, violeta, roxo, lilas, rosa, rose (as 4 primeiras letras).

              
                
                    <span class="Bverm dg1">
                        Bverm dg1
                    </span>
                    <span class="Bpedr5 dg3">
                        Bpedr5 dg3
                    </span>
                    <span class="Bverm10 dg10">
                        Bverm10 dg10
                    </span>
                    <span class="Bazul dg7">
                        Bazul dg7
                    </span>                  
                
              
            

Textos

.T{cor padrão}(1 | 10) =Cores Padrões;
.T{cor}[1|20] = Cores;
.T{cor}D = Cores Degrade;

Cores Padrões

Principal, Secundaria, Infor, Alerta, Sucesso, Claro, Noturno (as 4 primeiras letras).

Cores

preto, branco, neutro, pedra, cinza, gold, amarelo, laranja, coral, vermelho, marron, marron, brown, olive, limão, verde, turqueza, cian, céu, teal, azul, índigo, navy, violeta, roxo, lilas, rosa, rose (as 4 primeiras letras).

              
                
                    <span class="Tprin">
                        Tprin
                    </span>
                    <span class="Taler">
                        Taler
                    </span>
                    <span class="Tcinz">
                        Tcinz
                    </span>
                    <span class="Tverm">
                        Tverm
                    </span>                  
                
              
            

Texto cores primarias

Texto cores em Degrade

.T{cor}D =Cores Padrões;
Ex.: .TcinzD | TamarD | TsucessoD | TinforD
(Texto em degrade não aceita background)

Cores Padrões

Principal, Secundaria, Infor, Alerta, Sucesso, Claro, Noturno (as 4 primeiras letras).

Cores

preto, branco, neutro, pedra, cinza, gold, amarelo, laranja, coral, vermelho, marron, marron, brown, olive, limão, verde, turqueza, cian, céu, teal, azul, índigo, navy, violeta, roxo, lilas, rosa, rose (as 4 primeiras letras).

Opacidade em Texto

.T{cor}[17|20] =10% 25% 50% 75%
.T{cor padrão}[1|4] =10% 25% 50% 75%
Ex.: .Tcinz17 | Tprin4 | Tsuce2
(Texto em degrade não aceita background)

Cores Padrões

Principal, Secundaria, Infor, Alerta, Sucesso, Claro, Noturno (as 4 primeiras letras).

Cores

preto, branco, neutro, pedra, cinza, gold, amarelo, laranja, coral, vermelho, marron, marron, brown, olive, limão, verde, turqueza, cian, céu, teal, azul, índigo, navy, violeta, roxo, lilas, rosa, rose (as 4 primeiras letras).

                  
                    
                    <span class="Tprin3">
                        Tprin3 - 75%
                    </span>
                    <span class="Taler2">
                        Taler2 - 25%
                    </span>
                    <span class="Tcinz19">
                        Tcinz19 - 50%
                    </span>
                    <span class="Tverm17">
                        Tverm17 - 10%
                    </span>