Barra de rolagem colorida

Oi, gente! Estava visitando o blog Pink Skull Design e me deparei com esse tutorial, que vim correndo testar. Amei o resultado! E como tudo que amo, nem perdi tempo para repassá-lo a vocês! Créditos e mais créditos ao Pink Skull Design - blog incrível, visitem! O tutorial é bem facinho, vamos lá:



1. Vá em Design, depois em Editar HTML, dê Ctrl+F e procure por:

]]></b:skin>

2. E ANTES dele, cole:

*{
scrollbar-face-color:#FF69B4;
scrollbar-highlight-color:#FF69B4;
scrollbar-3dlight-color:#343434;
scrollbar-darkshadow-color:#343434;
scrollbar-shadow-color:#FF69B4;
scrollbar-arrow-color:#343434;
scrollbar-track-color:#343434;
}

::-webkit-scrollbar {width: 12px; height: 4px; background: #343434; }
::-webkit-scrollbar-thumb { background: #FF69B4; }

Visualize, se estiver tudo certinho, salve.

Observação: Os códigos destacados em roxo representam a cor da barra, e os destacados em verde representa a cor de fundo. Se quiser, você pode mudar as cores, basta substituir os códigos destacados. Essa tabela tem várias cores. Não funciona no Firefox.

Super fácil, não? Ah, e não se esqueçam de visitar:




51 comentários:

Bárbara disse...

Adorei o post. Adoro seu Blog, Parabéns!! Bjss
http://fanforfan.blogspot.com/

It girls disse...

Gostei do post, da um ar divertido a barra de rolagem assim ^^

Câmmý disse...

adorei e claro já testei !
EU AMO O MN *-----------*


exclamegirls.blogpot.com

Luh Siglindes disse...

adorei o tutorial , ontem eu soube do pink scull design , hoje vou visitar novamente e seguir *-* parabéns pelo blog , sempre melhorando http://fashionscream.blogspot.com/

Márcia e Aline *-* disse...

Meu dels, amei isso, lá no meu ficou rosa shushs, seu blog é demais, eu amooo aqi, bjinhos!!
http://whatthehellsociedade.blogspot.com

Victoria disse...

Awwnn!! Eu tenho que colocar no meu blog!!(que esta trancado porque eu to começando ele ainda.)
Mais tarde eu vou liberar e talvez você queira conferir =D
http://queen-ofdiamonds.blogspot.com/

pink skull design disse...

Tudo bem, está autorizada a postar ;)

Quanto a afiliação, você já fez exatamente aquilo que eu proponho. O que você prefere, banner 88x 31 ou link de texto?

Marília Maia disse...

olá. adorei a dica =] vou por la no meu blog!! =] bjoo
http://www.maryecia.blogspot.com/

Renata Gomez disse...

Andreza nao consegui colocar eu achei colei em cima do skin visualizei e nao vi nada :S

Sabrina disse...

Te deixei um email em encomenda.

Beijos.

Hallana disse...

Adooorei o tutorial, mandou super bem :3
Beijos.

webcalcinha.blogspot.com

Isabella F. disse...

Eu resolvi mudar. Te linkei nesta página:

http://blog.pinkskulldesign.com/p/valem-varios-cliques.html

Assim eu consigo linkar todo mundo rsrsr!

૮α૨ѳℓ disse...

Nossa, amei!

Place Fame disse...

Ah, a Isa é tudo né, cada tutorial dela me amarro. Ah que bom que gostou do Extras! Beijos.

Vanessa Vieira disse...

Quero depois confugurar meu blog, com suas dicas vão me ajudar muito
estou te seguindo,
depois da uma passada no meu blog
http://comicaseironicasdaocronicas.blogspot.com/

bjoos

luana oliveira ♡ disse...

ei amr ! participe do novo concurso de textos entre o blog paradateen e o textos perfeitos !
http://textosperfeitos-blog.blogspot.com/2011/08/vagas-abertas.html não deixe de partiicipar por nada ! *-*

Hellenzinha disse...

participa do concurso do blog http://cantoseencantosdahellen.blogspot.com/2011/08/concurso-ceh.html

Cecí disse...

Oii,tudo bem?Adorei aqui *Já estou seguindo!Aceita afiliação?Beijinhos:*

simplismentepapoteen.blogspot.com
Cecí

Biiãa Andraadee disse...

Eu via em apenas alguns blog, uma minoria, agora tenho certeza de que a maioria vai fazer esse tuto.

Besos ,

Biiãa Andraade - PM

http://paraisodemenina.blogspot.com/

Amanda disse...

Obrigadaaa! <3

hgdhsf disse...

NOSSA, EU ESTAVA PROCURANDO ESSE TUTORIAL A MUITO TEMPO, JÁ TINHA TENTADO DE TUDO E O QUE EU CONSEGUI FOI SÓ ESTRAGAR O MEU LAYOUT, OBRIGADA, VOCÊ ME SALVOU!!!

Anônimo disse...

http://disneyprogramacao.blogspot.com/2011/08/sorteio-edicao-especial-merheje.html

Anônimo disse...

SORTEIO MERHEJE

CONCORRA A 8 PRODUTOS INCRIVEIS


http://disneyprogramacao.blogspot.com/2011/08/sorteio-edicao-especial-merheje.html

Elizabeth Passos disse...

Miga, miga posta como colocar esses quadrinhos lindos de comentar personalizados:( procurei pela net mas nada:(

Sempre passo aki pra ver suas diks!
Bjks da Eliz.

Ah!!!!!!!!!! vou tentar maas é claro no meu bloguinho esse ai em cima!

Lara Vic. disse...

uée eu não consegui colocar mimimi
adoro seu blog, baseei boa parte da minha reforma nele *0*
beeijos!!

Stela Schulz Martins disse...

Tem award la no meu blog para vc fofa http://sweetdreamsoficial.blogspot.com

Larissa disse...

Oi!Abcabei de encontrar esse blog lindo!E queria tirar uma dúvida, como criar o código html?

República Clichê disse...

Super esse tutorial! Só que pretendo faze-lo em um novo design.

http://republicacliche.blogspot.com/

ზ Fernanda Moraes disse...
Este comentário foi removido pelo autor.
Aninha Orth disse...

O ASG esta promovendo um concurso de 300 seguidores, participa? http://blog-always-sweet-girl.blogspot.com/

#Biiaanca.BN disse...

Adorei esse tuto, muito legal. Ah, e as vagas para afiliados ainda estão abertas?

Beijos
ng-oficial.blogspot.com

Elizabeth Passos disse...

Oi miguinha! Só tô passado pra te informar que coloquei o MN no meu blog como afiliado pra testar um tutor! Mas, vou deixar lá pra galera vim visitar vc! Se vc quiser contribuir reciprocamente me avise! Mas, não és obrigada!

Bjks da Eliz.
elizabethpassos.blogspot.com

Giovanna Santos disse...

Oii Andreza! Sigo o Blog expetacular!!! Segue devolta? BJAO!
Gih S*

Lygia Benevides :* disse...

Adorei , vou colocar no meu ! rsrs
ja to seguindo .
visita la o meu blog e se poder participa da tag nova ?
http://befrees2.blogspot.com/

Isabella disse...

Hoy flor,seu blog está em uma postagem do Blog de Viagem. Confere: http://s2isaa.blogspot.com/2011/08/blogs-que-eu-admiro.html#more

Denyse disse...

Não funcionou Andreza :/

AnaaCariina' disse...

Era mesmo isto que andava a procura ! Briigada :)

Elizabeth Passos disse...

Consegui!!!! IUP!!! E até arredondei!

Ana❀ disse...

Nossa, adorei!!!
Amei o blog, tô seguindo, aceita parceria??
http://cutiecatt.blogspot.com/
Bjs :)

Meriane Brião disse...

No meu blog ficou rosa e não mudei nada! rsrs ficou lindo! valew!
http://meribriao.blogspot.com

rafs ! disse...

No meu não deu certo :(

Julia Queiroz disse...

AAAAMEI !
E,o mais engraçado foi que saiu exatamente da cor que eu queria,sem eu mexer nas cores u-u

heartcake-hc.blogspot.com

yui-chan disse...

wi você gosta de anime! xd

no se hablar portugués, de hecho esta oración la hize con google traductor

no te rias si esta mal XD

yui-chan disse...

Obviamente, meu nome é yui, se você perguntasse xd

=w=

yui-chan disse...

meu nome não é yui

google tradutor mal traduzida xd

(Não fale Português)

Ray C. disse...

Aaaaaaah adorei

Gabi disse...

Oi!Seguindo teu blog!Retribui?bjus
PS:amei o tutorial. tava procurando um desses pra testas no meu blog!
babizinha33.blogspot.com

*****Giulia***** disse...

Usei no meu blog. dá uma olhada? http://baggirl-bg.blogspot.com...

Thaty La Rosê disse...

muito bommm, gostei

Fernanda Carolina B. disse...

adorei! visita lá http://prasempreviva.blogspot.com/

Andreza Paixão-Christian Girl disse...

Linda amei a postagem,obrigada pela ajuda,consegui fazer e meu blog agora ta mais lindoo,ameii obrigada,gostei do blog,me visita se gostar segui e deixa um comentário e sigo de volta kiss.
http://dezapaixao.blogspot.com/