Efeito Bokeh

Olá~~

Trouxe um tutorial de como fazer um efeito super lindo o efeito Bokeh para

visualizá-lo clique aqui[www]

Super diferente não? Adorei a bordinha dele!

Vá no seu HTML aperte f3 e procure por:

/b:skin

Acima dessa tag cole isso:

 .icons {  background-image: url(http://media.tumblr.com/tumblr_m390unzbo31qmub55.png);

background-position: top;

padding: 4px;

margin: 6px;

border: 1px solid #ffffff;

-webkit-box-shadow: 0 0 5px #d1a7a4;   

-moz-box-shadow: 0 0 5px #d1a7a4;   

box-shadow: 0 0 5px #d1a7a4;

-moz-border-radius: 10px 0px 10px 0px;

-webkit-border-radius: 10px 0px 10px 0px;

border-radius: 10px 0px 10px 0px;

opacity:.70;

filter: alpha(opacity=70);

  -moz-opacity: 0.7;

-moz-transition-property: background-position, border, -webkit-box-shadow, -moz-box-shadow, box-shadow, color;-moz-transition-duration: 2s;

-webkit-transition-property: background-position, border, -webkit-box-shadow, -moz-box-shadow, box-shadow, color;-webkit-transition-duration: 2s;

-o-transition-property: background-position, -webkit-box-shadow, -moz-box-shadow, box-shadow, color;-o-transition-duration: 2s;}

.icons:hover { background-position: bottom;

border: 1px solid #ffffff;

opacity:1.0;

filter: alpha(opacity=100);

-webkit-box-shadow: 0 0 5px #cabbac;   

-moz-box-shadow: 0 0 5px #cabbac;   

box-shadow: 0 0 5px #cabbac;

 -moz-opacity: 1.0;

-moz-transition-property: background-position, border, -webkit-box-shadow, -moz-box-shadow, box-shadow, color;-moz-transition-duration: 2s;

-webkit-transition-property: background-position, border, -webkit-box-shadow, -moz-box-shadow, box-shadow, color;-webkit-transition-duration: 2s;

-o-transition-property: background-position, border, -webkit-box-shadow, -moz-box-shadow, box-shadow, color;-o-transition-duration: 2s;}

Modifique as cores com essa tabela[www]

Agora vá no seu Layout, Adicione um Gadget, HTML/Javacript

e adicione isso:

<img src="http://25.media.tumblr.com/tumblr_mdecf3qcJC1qev9yso1_250.png" align="center" width="100" class="icons" />

Se quiser trocar a imagem veia nesse marcador 

do blog[www] e para mudar o tamanho 

mude width="100" por width="300"

ou o número que você quer.