sábado, 17 de setembro de 2011

Abouts para orkut.

Oi,oi gente estou aq para encher o saco de vocês!
Zuei kkk'
tô aqui pra postar alguns abouts que eu mesma fiz, Melina peifer pra vocês !
Aqui estão alguns:







sábado, 10 de setembro de 2011

Barra De Rollagem Horizontal

Apenas retire o asteriscos; e pronto! Cole no orkut .            




<*pre><*div style="border: 1px solid rgb(205, 211, 218); padding: 5px; overflow: auto; background-color: rgb(247, 248, 249);"*> ESCREVA AQUI UM TEXTO LONGO <*/div><*/pre>


By:Tudegas!

Efeito Mouse Com Estrelinhas

Achamos um código para colocar estrelinhas caindo do cursor do mouse (sinal de +) para usar no blog, ele é bem simples de colocar e funcionou bem nos testes que fizemos com vários navegadores: Internet Explorer, Firefox e Google Chrome.
Caso tenha duvidas sobre onde colocar os códigos no blog não se preocupe, pois é bem simples de colocar esse efeito de estrelas seguindo o ponteiro do mouse.

Clique nas imagens para amplia-las;



Entre na pagina editar HTML, e segure Ctrl+F no seu teclado e irá aparecer uma caixa de pesquisa assim :


Procure por </body> e cole esse código antes dessa linha que acabou de achar:


<script type='text/javascript'>
// <![CDATA[
var colour="#FFD700";
var sparkles=50;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="2px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="2px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>


Para trocar a cor deste efeito você só precisa mudar o código que está logo no começo do código:
var colour="#FFD700";

Veja aqui o código das cores. Outro ajuste interessante é a quantidade de estrelinhas isso você altera em var sparkles=50. Esperamos que gostem deste efeito para seu blog.

Como dissemos realizamos alguns testes a única coisa que não foi possível corrigir é que em alguns templates quando visualizados no Internet Explorer as estrelinhas ficam um pouco distantes do ponteiro do mouse.




Bý:Tudegas=]

Personalizar títulos do menu do blog

Colocar os títulos da sidebar, menu lateral, com formatação diferente ou dentro de uma caixa, ou qualquer outra forma como fazemos aqui em um retângulo com cantos arredondados devemos fazer isso pela pagina editar HTML, colocando uma imagem de fundo de fundo no estilo h2 .

Falamos h2, pois é assim na maioria dos blogs, mas se no seu caso não funcionar para saber qual o estilo dos títulos do menu veja o HTML do seu blog e procure pelos títulos que usa então saberá qual configurar. Entre no seu blog clique com o botão direito do mouse num espaço vazio(fora de imagens ou video) e escolha a opção exibir código de fonte, então procure por um dos títulos do seu menu. No caso do Dicas para Blogs encontramos assim: <h2>Guia Rápido</h2> , portanto vamos formatar o h2, mas se no seu blog for outro use esse outro estilo.

Na pagina editar HTML encontramos

h2{..........} então coloque aqui a imagem de fundo junto com o restante do código. O nosso blog ficou assim:
h2 {background-image: url(http://img24.imageshack.us/img24/8909/menudm1.jpg);background-repeat: no-repeat;background-position: center;font-size: 120%;text-align: center;height: 30px;padding-top:9px;color: #000000}

o começo do código é a imagem de fundo background-image: url(http://img24.imageshack.us/img24/8909/menudm1.jpg

Depois tem a parte que impede a repetição e centraliza a imagem de fundo background-repeat: no-repeat;background-position: center;

height: 30px; é a altura da linha, ou seja, deixe igual à altura da imagem.

Outro detalhe é caso aparecer essa imagem de fundo em outro lugar como, por exemplo, no titulo das postagens, então corrigimos isso assim:

h2.date-header {background-image: none;

Isso faz que o estilo h2 date-header não tenha fundo, mais uma vez se precisar localizar o nome exato do estilo faça do mesmo jeito que indicamos para saber qual o estilo dos títulos do menu.



Bý:Tudegas =]

quinta-feira, 8 de setembro de 2011

BotãoTeca!

Estou postando pra vocês alguns dos Botões com sons pra por no perfil do orkut que está super na moda!
É só juntar os códigos! 
Clique aqui e vá ao site dos botões


  Cantando no Chuveiro  
<div style="width:200;"><table><tr><td>
<object width="110" height="110"><param name="movie" value="http://static.botaoteca.com.br/nathan.swf"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://static.botaoteca.com.br/nathan.swf" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="110" height="110"></embed></object></td></tr><tr><td> </td></tr><td style="font-family: Arial,Sans-serif;font-weight:bold;">Botaoteca - Instant Button Cantando no Chuveiro<br></td></tr></table></div>
  Felipe Neto 
<div style="width:200;"><table><tr><td>
<object width="110" height="110"><param name="movie" value="http://static.botaoteca.com.br/felipeneto.swf"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://static.botaoteca.com.br/felipeneto.swf" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="110" height="110"></embed></object></td></tr><tr><td> </td></tr><td style="font-family: Arial,Sans-serif;font-weight:bold;">Botaoteca - Instant Button Felipe Neto<br></td></tr></table></div>




Enviar atualizações por E-mail

Alguns blogs inclusive esse tem um serviço que envia um email avisando sobre nossas atualizações, isso é bem útil e aumenta o numero de visitas do blog. E fazer o mesmo com o seu blog é mais fácil do parece, você só precisa fazer um cadastro no Feedburner e configurar seu blog nele.
Primeiro vamos deixar o site em português, pois assim é mais fácil, no topo da pagina tem a palavra language, clique nela e na próxima pagina clique na palavra português, está certo que não é uma tradução perfeita, pois ele usa a expressão Queime um feed agora mesmo. Mas é melhor do que usar o site em inglês.

Veja aqui algumas Configurações do Feedburner - Personalizar as Atualizações por E-mail e outra maneira de personalizar o serviço é Colocando imagem no FeedBurner.

Depois que fizer o cadastro coloque o feed do seu blog no campo Queime um feed agora mesmo, se não souber seu feed vá até seu blog e copie o link que está no final da pagina na “Assinar: Postagens (Atom)”, seu feed é assim:
http://SEUBLOG.blogspot.com/feeds/posts/default
Então é só clicar em avançar, e avançar novamente, o site já vai mostrar o endereço do seu feed gerado pelo Feedburner, é o link abaixo disso: Congrats! Your FeedBurner feed is now live. Want to dress it up a little?Subscribe to your feed (and share with others!) at.

Clique no botão próximo no final da pagina e clique novamente. Agora clique na guia publicar e no menu da esquerda em Email Subscriptions, agora aperto o botão ativar e aparecerá a tela Gerenciamento de Cadastros, troque a language para Português e pronto. Agora é só copiar um dos códigos abaixo. O primeiro código mostrará no seu blog um campo de texto para a pessoa digitar o email e assinar o feed, para receber as suas atualizações no email que ela indicou.

O segundo código que tem nesta pagina mostra apenas um link para assinar o feed e o processo é o mesmo, então se quiser usar alguma imagem como link para receber suas atualizações por email é só copiar esse código da segunda caixa e colocar uma imagem nele. O código com imagem fica assim:

<a href="http://www.feedburner.com/fb/a/emailverifySubmit?feedId=2104814&amp;loc=pt_BR"
target="_blank" title="Receba nossas mensagens por e-mail"><img
border="0" src="http://img6.imageshack.us/img6/2467/emaillw8.jpg"/></a>

Copiamos esse exemplo do nosso outro blog Frases Curtas. Depois que pegar esse código entre na pagina layout do seu blog, clique para adicionar um gadget, escolha a opção html/javascript e cole o código. 



By:Tudegas

Colocar o botão +1 no Google Blogs

Mostre que seu Blog é relevante e tem bom conteúdo, coloque o botão +1 do Google no seu blog. Ele já está aparecendo automaticamente para as pessoas que usam os botões de compartilhamento do blogger e nestes casos não é necessário fazer alteração nenhuma, mas para quem não usa esses botões para divulgar o blog em Redes Sociais como twitter, facebook, orkut e outros, então temos a opção de colocar o botão +1 do google separadamente pegando o código na pagina do Google, isto também pode ser útil se quiser escolher uma posição de mais destaque para esse botão em sua pagina como, por exemplo colocar o botão fixo no canto da pagina.

Para mostrar os botões de compartilhamento no seu blog na pagina design, clique para editar as postagens e marque a opção Mostrar botões de compartilhamento, como está na imagem abaixo, caso tenha alguma duvida veja aqui um tutorial mais detalhado: Mostrar Botões de Compartilhamento no Blogspot.

Clique nas imagens para amplia-lás.



Sobre colocar o botão separadamente dos outros botões de compartilhamento entre na pagina da central para webmasters e pegar o código do botão +1 você se o idioma não estiver em português você deve alterar o idioma para português e escolher o tamanho do botão.


O código gerado pela pagina é assim:
<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'pt-BR'}
</script><!-- Place this tag where you want the +1 button to render -->
<g:plusone></g:plusone>




Você deve colocar no seu blog separadamente (editar html e gadget html/javascript), pois nos testes que fizemos se colocar num gadget de html/javascript o botão não pareceu em todas as paginas. Entre na pagina editar html, e coloque essa linha de código antes de </head> (use o ctrl F para achar).


<script type="text/javascript" src="http://apis.google.com/js/plusone.js">


Bý:Tudegas



Mostrar Botões de Compartilhamento no Blogspot

Já mostramos diversos tutoriais sobre botões para redes sociais, mas ainda faltou falar sobre os botões para esses sites e agregadores de links feitos pelo próprio Blogger (Mostrar botões de compartilhamento). Você pode ativar essa opção pela pagina designer do modelo, mas precisa adicionar mais um código html para que funcione realmente os botões para Orkut, Twitter, Facebook e Google Buzz(Botão do Facebook, Twitter, Google Buzz no mesmo Gadget).

compartilhar blogger
Como já dissemos o primeiro passo é ativar esse acessório na pagina designer do modelo clicando para editar as postagens e marcando a opção Mostrar botões de compartilhamento.

Antes de começar recomendamos fazer um backup do HTML do seu blog. Agora entre na pagina editar html, marque para expandir modelos de widgets, procure por <div class='post-header-line-1'> ou <post.body/> e depois adicione esse código logo abaixo:

<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>

codigo de fonte do blog
Agora clique para salvar e visualize seu blog. Se quiser modificar o lado que os botões aparecem no seu blog volte a pagina editar html (Onde colocar os códigos no blog) e coloque essa linha de código CSS:

.post-share-buttons{float:left}

html do blogger
Do jeito que está os botões ficarão do lado esquerdo das postagens e para colocar do lado direito troque a palavra left por right no código acima.

Essa é mais uma opção para divulgar seu blog nas redes sociais(Botão para as redes sociais - AddThis), mas precisamos lembrar que o principal é ter um conteúdo interessante no blog para que as pessoas tenham motivos para usar esses botões para recomendar suas postagens a outras pessoas.

Colocar ou alterar as bordas


Existem vários modos de mudar o visual do blog somente utilizando o estilo CSS um deles é colocar ou alterar as bordas. Esse código é bem simples e pode se usado em qualquer lugar, serve inclusive para fazer botões quando combinados com uma cor de fundo, além disso podemos usar para colocar bordas nas postagens, menus e qualquer outra coisa no blog. O código das bordas deve ser moficado pela página editar HTML, agora vamos entender melhor esse código:

border: 1px solid #0000FF

1px é a largura

solid é o estilo

#0000FF é a cor

Por exemplo para colocar bordas nos link procure por:

a:link, a:visited {
color:#0000ff;
text-decoration:none;
}

e coloque border: 1px solid #0000FF, dentro das chaves, deixando o código assim:

a:link, a:visited {
border: 1px solid #0000FF;
color:#0000ff;
text-decoration:none;
}

Logo abaixo você pode ver outros exemplos de bordas e alterar como quiser a largura, estilo, cor e se precisa aqui tem o código das cores.


border: 2px dotted #000000

border: 2px dashed #000000

border: 1px solid #0000FF

border: 4px double #FF0000

border: 3px groove #6666FF

border: 4px ridge #FFFFCC

border: 3px inset #FFFF99

border: 2px outset #6699FF

Balão com Número de Comentários ao Lado do Título da Postagem

Uma forma de conseguir mais comentários no seu blog pode ser mostrar o numero de comentários dentro de um balão ou alguma outra imagem no inicio da postagem, ou seja, ao lado do titulo de cada post do blog. Isso pode ser uma maneira de incentivar os visitantes a deixarem seu comentário ou pelo menos ler o que os outros já falaram sobre aquele assunto. 



Para fazer essa alteração entre na pagina editar html, marque a opção expandir modelos de widgets e procure por: <class='post-title entry-title'> ou <b:includable id='post' var='post'>. Qual deles usar depende do modelo do seu template geralmente os templates novos usam a primeira opção.

Então logo depois coloque este código:

<span class='post-comment-link-arriba' style='background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiZwPnfiOqCASI0q_L1Qjt5gS6GG8NpLo5o8A5lB95wtqh8aVodgLsXOF9R9UX_Q3K_jIZookQYPosEhgL-B_-45Wbvc9CyO_pw_6Z5fM2Q8G_WUAcphDxcVDD3GP6u9s2XUU3CSaBvtk/s400/bubble.png) no-repeat top right; width:48px; height:48px; text-align:center; float:right;padding-top:8px'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <b:else/><data:post.numComments/></b:if></a>
</b:if>
</span>


Agora vamos falar sobre os ajustes necessários e como >trocar a imagem do bolão nos comentários do blog, veja esse trecho do código:

style='background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiZwPnfiOqCASI0q_L1Qjt5gS6GG8NpLo5o8A5lB95wtqh8aVodgLsXOF9R9UX_Q3K_jIZookQYPosEhgL-B_-45Wbvc9CyO_pw_6Z5fM2Q8G_WUAcphDxcVDD3GP6u9s2XUU3CSaBvtk/s400/bubble.png) no-repeat top right; width:48px; height:48px; text-align:center; float:right; padding-top:8px'

Aqui está toda a formatação de texto e posicionamento da imagem, então vamos por partes:

Trocar a imagem de fundo (balão)
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiZwPnfiOqCASI0q_L1Qjt5gS6GG8NpLo5o8A5lB95wtqh8aVodgLsXOF9R9UX_Q3K_jIZookQYPosEhgL-B_-45Wbvc9CyO_pw_6Z5fM2Q8G_WUAcphDxcVDD3GP6u9s2XUU3CSaBvtk/s400/bubble.png) no-repeat top right; width:48px; height:48px;

Isso é a imagem de fundo, então troque o endereço https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiZwPnfiOqCASI0q_L1Qjt5gS6GG8NpLo5o8A5lB95wtqh8aVodgLsXOF9R9UX_Q3K_jIZookQYPosEhgL-B_-45Wbvc9CyO_pw_6Z5fM2Q8G_WUAcphDxcVDD3GP6u9s2XUU3CSaBvtk/s400/bubble.png pela url de outra imagem que goste mais ou combine melhor com o seu template, você pode achar uma imagem no google, fazer um com um programa para edição de imagens ou achar icones prontos, depois hospede a imagem e coloque o endereço da imagem no código acima. (caso tenha duvidas leia: Imagem não aparece).

Os dois valores 48 é o tamanho da imagem, então deve fazer os ajustes com o tamanho da nova imagem que utilizar.

Posicionar corretamente o número de comentários dentro do balão
padding-top:8px esse é o espaço acima do numero, portanto altere esse valor até o numero de comentários ficarem na posição correta, lembre-se esse código muda a posição no sentido vertical (para cima e para baixo), na direção horizontal está centralizado automaticamente.

Formatação do Numero de comentários (texto)
Para formatar o texto, ou seja, o numero que aparece dentro do balão podemos criar um estilo CSS com o nome post-comment-link-arriba e colocar no inicio do html do blog, junto com o trecho body. Veja Onde colocar os códigos no blog. 

Código das Cores

Quando vamos mudar a cor de alguma coisa no blog ou site precisamos saber qual o código HTML da cor que vamos usar, porque o template é feito em CSS usando códigos para definir as cores de tudo menos as imagens é claro. Então aqui está uma lista com o código de muitas cores para você usar como quiser no seu blog.

Apesar do blogspot ter uma página de cores com algumas opções elas são limitadas então procure a cor que gostar na lista abaixo e copie o código para usar no blog, esses códigos serem para mudar a cor de tudo: fundo do blog, cores das letras, fundo das postagens ou sidebar, cores das bordas, enfim qualquer cor que veja num blog é definido através desses códigos. Então é só usar a lista de cores e deixar seu blog mais bonito e com cores diferentes. Essa lista foi adaptada apartir de uma página do site MXStudio.


WhiteSmoke #F5F5F5

Gainsboro #DCDCDC

FloralWhite #FFFAF0

OldLace #FDF5E6

Linen #FAF0E6

AntiqueWhite #FAEBD7

PapayaWhip #FFEFD5

BlanchedAlmond #FFEBCD

Bisque #FFE4C4

PeachPuff #FFDAB9

NavajoWhite #FFDEAD

Moccasin #FFE4B5

Cornsilk #FFF8DC

Ivory #FFFFF0

LemonChiffon #FFFACD

Seashell #FFF5EE

Honeydew #F0FFF0

MintCream #F5FFFA

Azure #F0FFFF

AliceBlue #F0F8FF

lavender #E6E6FA

LavenderBlush #FFF0F5

MistyRose #FFE4E1

White #FFFFFF

Black #000000

DarkSlateGray #2F4F4F

DimGrey #696969

SlateGrey #708090

LightSlateGray #778899

Grey #BEBEBE

LightGray #D3D3D3

MidnightBlue #191970

NavyBlue #000080

CornflowerBlue #6495ED

DarkSlateBlue #483D8B

SlateBlue #6A5ACD

MediumSlateBlue #7B68EE

LightSlateBlue #8470FF

MediumBlue #0000CD

RoyalBlue #4169E1

Blue #0000FF

DodgerBlue #1E90FF

DeepSkyBlue #00BFFF

SkyBlue #87CEEB

LightSkyBlue #87CEFA

SteelBlue #4682B4

LightSteelBlue #B0C4DE

LightBlue #ADD8E6

PowderBlue #B0E0E6

PaleTurquoise #AFEEEE

DarkTurquoise #00CED1

MediumTurquoise #48D1CC

Turquoise #40E0D0

Cyan #00FFFF

LightCyan #E0FFFF

CadetBlue #5F9EA0

MediumAquamarine #66CDAA

Aquamarine #7FFFD4

DarkGreen #006400

DarkOliveGreen #556B2F

DarkSeaGreen #8FBC8F

SeaGreen #2E8B57

MediumSeaGreen #3CB371

LightSeaGreen #20B2AA

PaleGreen #98FB98

SpringGreen #00FF7F

LawnGreen #7CFC00

Green #00FF00

Chartreuse #7FFF00

MedSpringGreen #00FA9A

GreenYellow #ADFF2F

LimeGreen #32CD32

YellowGreen #9ACD32

ForestGreen #228B22

OliveDrab #6B8E23

DarkKhaki #BDB76B

PaleGoldenrod #EEE8AA

LtGoldenrodYello #FAFAD2

LightYellow #FFFFE0

Yellow #FFFF00

Gold #FFD700

LightGoldenrod #EEDD82

goldenrod #DAA520

DarkGoldenrod #B8860B

RosyBrown #BC8F8F

IndianRed #CD5C5C

SaddleBrown #8B4513

Sienna #A0522D

Peru #CD853F

Burlywood #DEB887

Beige #F5F5DC

Wheat #F5DEB3

SandyBrown #F4A460

Tan #D2B48C

Chocolate #D2691E

Firebrick #B22222

Brown #A52A2A

DarkSalmon #E9967A

Salmon #FA8072

LightSalmon #FFA07A

Orange #FFA500

DarkOrange #FF8C00

Coral #FF7F50

LightCoral #F08080

Tomato #FF6347

OrangeRed #FF4500

Red #FF0000

HotPink #FF69B4

DeepPink #FF1493

Pink #FFC0CB

LightPink #FFB6C1

PaleVioletRed #DB7093

Maroon #B03060

MediumVioletRed #C71585

VioletRed #D02090

Magenta #FF00FF

Violet #EE82EE

Plum #DDA0DD

Orchid #DA70D6

MediumOrchid #BA55D3

DarkOrchid #9932CC

DarkViolet #9400D3

BlueViolet #8A2BE2

Purple #A020F0

MediumPurple #9370DB

Thistle #D8BFD8

Snow1 #FFFAFA

Snow2 #EEE9E9

Snow3 #CDC9C9

Snow4 #8B8989

Seashell1 #FFF5EE

Seashell2 #EEE5DE

Seashell3 #CDC5BF

Seashell4 #8B8682

AntiqueWhite1 #FFEFDB

AntiqueWhite2 #EEDFCC

AntiqueWhite3 #CDC0B0

AntiqueWhite4 #8B8378

Bisque1 #FFE4C4

Bisque2 #EED5B7

Bisque3 #CDB79E

Bisque4 #8B7D6B

PeachPuff1 #FFDAB9

PeachPuff2 #EECBAD

PeachPuff3 #CDAF95

PeachPuff4 #8B7765

NavajoWhite1 #FFDEAD

NavajoWhite2 #EECFA1

NavajoWhite3 #CDB38B

NavajoWhite4 #8B795E

LemonChiffon1 #FFFACD

LemonChiffon2 #EEE9BF

LemonChiffon3 #CDC9A5

LemonChiffon4 #8B8970

Cornsilk1 #FFF8DC

Cornsilk2 #EEE8CD

Cornsilk3 #CDC8B1

Cornsilk4 #8B8878

Ivory1 #FFFFF0

Ivory2 #EEEEE0

Ivory3 #CDCDC1

Ivory4 #8B8B83

Honeydew1 #F0FFF0

Honeydew2 #E0EEE0

Honeydew3 #C1CDC1

Honeydew4 #838B83

LavenderBlush1 #FFF0F5

LavenderBlush2 #EEE0E5

LavenderBlush3 #CDC1C5

LavenderBlush4 #8B8386

SlateGray4 #6C7B8B

LightSteelBlue1 #CAE1FF

LightSteelBlue2 #BCD2EE

LightSteelBlue3 #A2B5CD

LightSteelBlue4 #6E7B8B

LightBlue1 #BFEFFF

LightBlue2 #B2DFEE

LightBlue3 #9AC0CD

LightBlue4 #68838B

LightCyan1 #E0FFFF

LightCyan2 #D1EEEE

LightCyan3 #B4CDCD

LightCyan4 #7A8B8B

PaleTurquoise1 #BBFFFF

PaleTurquoise2 #AEEEEE

PaleTurquoise3 #96CDCD

PaleTurquoise4 #668B8B

CadetBlue1 #98F5FF

CadetBlue2 #8EE5EE

CadetBlue3 #7AC5CD

CadetBlue4 #53868B

Turquoise1 #00F5FF

Turquoise2 #00E5EE

Turquoise3 #00C5CD

Turquoise4 #00868B

Cyan1 #00FFFF

Cyan2 #00EEEE

Cyan3 #00CDCD

Cyan4 #008B8B

DarkSlateGray1 #97FFFF

DarkSlateGray2 #8DEEEE

DarkSlateGray3 #79CDCD

DarkSlateGray4 #528B8B

Aquamarine1 #7FFFD4

Aquamarine2 #76EEC6

Aquamarine3 #66CDAA

Aquamarine4 #458B74

DarkSeaGreen1 #C1FFC1

DarkSeaGreen2 #B4EEB4

DarkSeaGreen3 #9BCD9B

DarkSeaGreen4 #698B69

SeaGreen1 #54FF9F

SeaGreen2 #4EEE94

MistyRose1 #FFE4E1

MistyRose2 #EED5D2

MistyRose3 #CDB7B5

MistyRose4 #8B7D7B

Azure1 #F0FFFF

Azure2 #E0EEEE

Azure3 #C1CDCD

Azure4 #838B8B

SlateBlue1 #836FFF

SlateBlue2 #7A67EE

SlateBlue3 #6959CD

SlateBlue4 #473C8B

RoyalBlue1 #4876FF

RoyalBlue2 #436EEE

RoyalBlue3 #3A5FCD

RoyalBlue4 #27408B

Blue1 #0000FF

Blue2 #0000EE

Blue3 #0000CD

Blue4 #00008B

DodgerBlue1 #1E90FF

DodgerBlue2 #1C86EE

DodgerBlue3 #1874CD

DodgerBlue4 #104E8B

SteelBlue1 #63B8FF

SteelBlue2 #5CACEE

SteelBlue3 #4F94CD

SteelBlue4 #36648B

DeepSkyBlue1 #00BFFF

DeepSkyBlue2 #00B2EE

DeepSkyBlue3 #009ACD

DeepSkyBlue4 #00688B

SkyBlue1 #87CEFF

SkyBlue2 #7EC0EE

SkyBlue3 #6CA6CD

SkyBlue4 #4A708B

LightSkyBlue1 #B0E2FF

LightSkyBlue2 #A4D3EE

LightSkyBlue3 #8DB6CD

LightSkyBlue4 #607B8B

SlateGray1 #C6E2FF

SlateGray2 #B9D3EE

SlateGray3 #9FB6CD

Firebrick4 #8B1A1A

Brown1 #FF4040

Brown2 #EE3B3B

Brown3 #CD3333

Brown4 #8B2323

Salmon1 #FF8C69

Salmon2 #EE8262

Salmon3 #CD7054

Salmon4 #8B4C39

LightSalmon1 #FFA07A

LightSalmon2 #EE9572

LightSalmon3 #CD8162

LightSalmon4 #8B5742

Orange1 #FFA500

Orange2 #EE9A00

Orange3 #CD8500

Orange4 #8B5A00

DarkOrange1 #FF7F00

DarkOrange2 #EE7600

DarkOrange3 #CD6600

DarkOrange4 #8B4500

Coral1 #FF7256

Coral2 #EE6A50

Coral3 #CD5B45

Coral4 #8B3E2F

Tomato1 #FF6347

Tomato2 #EE5C42

Tomato3 #CD4F39

Tomato4 #8B3626

OrangeRed1 #FF4500

OrangeRed2 #EE4000

OrangeRed3 #CD3700

OrangeRed4 #8B2500

Red1 #FF0000

Red2 #EE0000

Red3 #CD0000

Red4 #8B0000

DeepPink1 #FF1493

DeepPink2 #EE1289

DeepPink3 #CD1076

DeepPink4 #8B0A50

HotPink1 #FF6EB4

HotPink2 #EE6AA7

Gold2 #EEC900

HotPink3 #CD6090

HotPink4 #8B3A62

Pink1 #FFB5C5

Pink2 #EEA9B8

Pink3 #CD919E

Pink4 #8B636C

LightPink1 #FFAEB9

LightPink2 #EEA2AD

LightPink3 #CD8C95

LightPink4 #8B5F65

PaleVioletRed1 #FF82AB

PaleVioletRed2 #EE799F

PaleVioletRed3 #CD6889

PaleVioletRed4 #8B475D

Maroon1 #FF34B3

Maroon2 #EE30A7

Maroon3 #CD2990

Maroon4 #8B1C62

VioletRed1 #FF3E96

VioletRed2 #EE3A8C

VioletRed3 #CD3278

VioletRed4 #8B2252

Magenta1 #FF00FF

Magenta2 #EE00EE

Magenta3 #CD00CD

Magenta4 #8B008B

Orchid1 #FF83FA

Orchid2 #EE7AE9

Orchid3 #CD69C9

Orchid4 #8B4789

Plum1 #FFBBFF

Plum2 #EEAEEE

Plum3 #CD96CD

Plum4 #8B668B

MediumOrchid1 #E066FF

MediumOrchid2 #D15FEE

MediumOrchid3 #B452CD

MediumOrchid4 #7A378B

DarkOrchid1 #BF3EFF

DarkOrchid2 #B23AEE

DarkOrchid3 #9A32CD

DarkOrchid4 #68228B

Purple1 #9B30FF

Purple2 #912CEE

SeaGreen3 #43CD80

SeaGreen4 #2E8B57

PaleGreen1 #9AFF9A

PaleGreen2 #90EE90

PaleGreen3 #7CCD7C

PaleGreen4 #548B54

SpringGreen1 #00FF7F

SpringGreen2 #00EE76

SpringGreen3 #00CD66

SpringGreen4 #008B45

Green1 #00FF00

Green2 #00EE00

Green3 #00CD00

Green4 #008B00

Chartreuse1 #7FFF00

Chartreuse2 #76EE00

Chartreuse3 #66CD00

Chartreuse4 #458B00

OliveDrab1 #C0FF3E

OliveDrab2 #B3EE3A

OliveDrab3 #9ACD32

OliveDrab4 #698B22

DarkOliveGreen1 #CAFF70

DarkOliveGreen2 #BCEE68

DarkOliveGreen3 #A2CD5A

DarkOliveGreen4 #6E8B3D

Khaki1 #FFF68F

Khaki2 #EEE685

Khaki3 #CDC673

Khaki4 #8B864E

LightGoldenrod1 #FFEC8B

LightGoldenrod2 #EEDC82

LightGoldenrod3 #CDBE70

LightGoldenrod4 #8B814C

LightYellow1 #FFFFE0

LightYellow2 #EEEED1

LightYellow3 #CDCDB4

LightYellow4 #8B8B7A

Yellow1 #FFFF00

Yellow2 #EEEE00

Yellow3 #CDCD00

Yellow4 #8B8B00

Gold1 #FFD700

Gold3 #CDAD00

Gold4 #8B7500

Goldenrod1 #FFC125

Goldenrod2 #EEB422

Goldenrod3 #CD9B1D

Goldenrod4 #8B6914

DarkGoldenrod1 #FFB90F

DarkGoldenrod2 #EEAD0E

DarkGoldenrod3 #CD950C

DarkGoldenrod4 #8B658B

RosyBrown1 #FFC1C1

RosyBrown2 #EEB4B4

RosyBrown3 #CD9B9B

RosyBrown4 #8B6969

IndianRed1 #FF6A6A

IndianRed2 #EE6363

IndianRed3 #CD5555

IndianRed4 #8B3A3A

Sienna1 #FF8247

Sienna2 #EE7942

Sienna3 #CD6839

Sienna4 #8B4726

Burlywood1 #FFD39B

Burlywood2 #EEC591

Burlywood3 #CDAA7D

Burlywood4 #8B7355

Wheat1 #FFE7BA

Wheat2 #EED8AE

Wheat3 #CDBA96

Wheat4 #8B7E66

Tan1 #FFA54F

Purple3 #7D26CD

Purple4 #551A8B

MediumPurple1 #AB82FF

MediumPurple2 #9F79EE

MediumPurple3 #8968CD

MediumPurple4 #5D478B

Thistle1 #FFE1FF

Thistle2 #EED2EE

Thistle3 #CDB5CD

Thistle4 #8B7B8B

grey11 #1C1C1C

grey21 #363636

grey31 #4F4F4F

grey41 #696969

grey51 #828282

grey61 #9C9C9C

grey71 #B5B5B5

gray81 #CFCFCF

gray91 #E8E8E8

DarkGrey #A9A9A9

DarkBlue #00008B

DarkCyan #008B8B

DarkMagenta #8B008B

DarkRed #8B0000

LightGreen #90EE90

Chocolate3 #CD661D

Chocolate4 #8B4513

Firebrick1 #FF3030

Firebrick2 #EE2C2C

Firebrick3 #CD2626

Gold4 #8B7500

Goldenrod1 #FFC125

Goldenrod2 #EEB422

Goldenrod3 #CD9B1D

Goldenrod4 #8B6914

DarkGoldenrod1 #FFB90F

DarkGoldenrod2 #EEAD0E

DarkGoldenrod3 #CD950C

DarkGoldenrod4 #8B658B

RosyBrown1 #FFC1C1

RosyBrown2 #EEB4B4

RosyBrown3 #CD9B9B

RosyBrown4 #8B6969

IndianRed1 #FF6A6A

IndianRed2 #EE6363

IndianRed3 #CD5555

IndianRed4 #8B3A3A

Sienna1 #FF8247

Sienna2 #EE7942

Sienna3 #CD6839

Sienna4 #8B4726

Burlywood1 #FFD39B

Burlywood2 #EEC591

Burlywood3 #CDAA7D

Burlywood4 #8B7355

Tan2 #EE9A49

Tan3 #CD853F

Tan4 #8B5A2B

Chocolate1 #FF7F24

Chocolate2 #EE7621

Bý : Tudegas