#PSD 059
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Misplaced Lens Cap

tannertan36

Kaledo Art

Product Placement

#extradirty
Claire Keane

Discoholic đȘ©

ellievsbear
No title available
h
Lint Roller? I Barely Know Her

⣠Chile in a Photography âŁ
Mike Driver
cherry valley forever

Love Begins
Sweet Seals For You, Always
he wasn't even looking at me and he found me
"I'm Dorothy Gale from Kansas"

blake kathryn
NASA
seen from United Kingdom
seen from Italy

seen from Australia

seen from Australia

seen from Australia

seen from China
seen from United States

seen from United Kingdom
seen from United States

seen from United States

seen from Canada

seen from Mexico

seen from United States

seen from United States
seen from United States

seen from United States

seen from United Kingdom

seen from Malaysia
seen from United Kingdom

seen from TĂŒrkiye
@fe-themes
#PSD 059
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 058
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 057
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Menu Plus:
Preview [x]
1 - Cole esse código aqui [x] no seu CSS.
2 - Cole esse código aqui [x] depois de </style>.
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Efeito - Click and go (Para redes sociais)
Preview [x]
1 - Cole isso no seu CSS:
@import url(http://fonts.googleapis.com/css?family=Kite+One); *{margin:0;padding:0;border:0;vertical-align:baseline;} a[class^='icon-'] , a[class*='icon-']{display: block;font-size: 30px;speak:none;} input[type='checkbox']{display: none;} .badboy{width: 0;height: 0;clear: both;} label{display: block;position: relative;width: 35px;background:#f66;opacity: 0.75;margin-left: -1px;padding: 29px 10px;-webkit-transition: all .25s ease;-moz-transition: all .25s ease;}label:hover{opacity: 1;} .icon-menu{font-size: 2.6rem;} span{display: block;position: absolute;left: 4px;top: 5px;padding: 2px 5px;-webkit-transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;} label:hover{background: #f66;} #button-menu:checked ~ label span{-webkit-transform : rotate(90deg);-moz-transform : rotate(90deg);top: 5px;left: 4px;} #button-menu:checked ~ label{opacity: 1;} nav{width: 295px;background: #fff;margin-left: -398px;margin-top:-57px;-webkit-transition : all .25s ease-in-out;-moz-transition : all .25s ease-in-out;} menu{width: 295px;list-style: none;} li{float: left;} a{display: block;padding: 13px 25px;color : #f66;opacity: .28;} #button-menu:checked ~ nav {margin-left: 54px;} li:hover{background: #272822;} li:hover a:after{ visibility: visible;font-size: 30px;} a:hover{opacity: 1;-webkit-transition : all .25s ease-in-out;-moz-transition : all .25s ease-in-out;} a[class*='icon-']:after{display: block;content: '';position: absolute;left: 368px;top: 11px;visibility: hidden;font-family: 'Kite One';} a.icon-twitter:after{content: 'Twitter';} a.icon-facebook:after{content: 'Facebook';} a.icon-gplus:after{content: 'Gplus';} a.icon-gplus:before{content: '\f0d5';} a.icon-dribble:after{content: 'Dribble';left: 337px;padding : 0 30px 0 30px; } a.icon-dribble:before{content: '\f17d';} span:before{content: '\f0c9';}
2 -Â Cole isso depois de </style>:
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.2.1/css/font-awesome.min.css" /> <input type="checkbox" id="button-menu" /> <label for="button-menu" title='share button'> <span class='icon-menu'></span> </label> <nav> <menu> <li> <a href="LINKAQUI" class='icon-twitter'></a> </li> <li> <a href="LINKAQUI" class='icon-facebook'></a> </li> <li> <a href="LINKAQUI" class='icon-gplus'></a> </li> <li> <a href="LINKAQUI" class='icon-dribble'></a> </li> <div class="badboy"></div> </menu> </nav></div>
NOTA: Adaptado do CSS Deck [x] para disponibilizar no tumblr.
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Menu Movie:
Preview [x]
1 -Â Cole isso no seu CSS:
ul {text-align: left;display: inline;margin: 0;padding: 15px 4px 17px 0;list-style: none;} ul li {font: bold 12px/18px sans-serif;display: inline-block; position: relative;padding: 5px 5px;background: #fff;cursor: pointer;-webkit-transition: all 0.2s;-moz-transition: all 0.2s;-ms-transition: all 0.2s;-o-transition: all 0.2s; transition: all 0.2s;} ul li:hover {background: #A52A2A;color: #000} ul li ul {padding: 1;position: absolute;top: 55px;left: 0;width: 100px;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;display: none;opacity: 0;visibility: hidden} ul li ul li {Â background: #A52A2A;Â display: block;Â color: #fff;} ul li ul li:hover { background: #666; ul li:hover ul {display: block;opacity: 1;visibility: visible;}
2 - Cole isso depois de </style>:
<center> <ul><li><a href="LINK"><img src="http://appnotised.com.au/wp-content/themes/twentytwelve/images/tvc.png" /></a> <ul> <li>hover aqui</li> <li>hover aqui</li> </ul> </li> <li><a href="LINK"><img src="http://appnotised.com.au/wp-content/themes/twentytwelve/images/drama.png" /></a> <ul> <li>hover aqui</li> <li>hover aqui</li> </ul> </li> <li><a href="LINK"><img src="http://appnotised.com.au/wp-content/themes/twentytwelve/images/about.png" /></a> <ul> <li>hover aqui</li> <li>hover aqui</li> </ul> </li> <li><a href="LINK"><img src="http://appnotised.com.au/wp-content/themes/twentytwelve/images/links.png" /></a> <ul> <li>hover aqui</li> <li>hover aqui</li> </ul> </li> <li><a href="LINK"><img src="http://appnotised.com.au/wp-content/themes/twentytwelve/images/contact.png" /></a></li> <li><a href="http://fe-themes.tumblr.com"><img src="http://appnotised.com.au/wp-content/themes/twentytwelve/images/login.png" title="(c)"/></a></li> </ul></center>
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Menu Blue Icons:
Preview [x]
1 - Cole isso no seu CSS:
@import url(http://fonts.googleapis.com/css?family=Cuprum:400,700); body { padding: 0px; margin: 0px; background: #000811; } .mainmenu { color: #ccc; font-size: 16px; font-family: 'Cuprum', Georgia, "Times New Roman", Times, Serif; background: #002244; width: 100%; height: 51px; border: 1px solid #026; border-bottom: 3px solid #012; text-shadow: 0 1px 0 #000;} .mainmenu ul {margin: 0; padding: 0; } .mainmenu li i { position: absolute; margin-left: -35px; margin-top: 6px; color: #012; text-shadow: 0 1px 0 #036;} .mainmenu li { float: left; display: block; padding: 10px 10px 10px 50px; border-right: 1px solid #012; cursor: pointer; min-width: 100px; max-width: 100px; } .mainmenu li:hover { background: #012; } .mainmenu li:hover i {color: #036; text-shadow: 0 1px 0 #000;} .mainmenu li main {font-weight: 700; margin-top: -18px; } .mainmenu li desc { position: relative; float: left; font-size: 11px; color: #888; } .mainmenu li, .mainmenu li i, .mainmenu li main, .mainmenu li desc {-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out;-webkit-transition: all 0.8s ease-in-out;} .mainmenu li:hover main { margin-left: 10px; -moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;-webkit-transition: all 0.4s ease-in-out;}mainmenu li:hover desc { margin-left: 30px; -moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;-webkit-transition: all 0.4s ease-in-out;}
2 - Cole isso depois de </style>:
<script type="text/javascript" language="javascript" src="http://assets.tumblr.com/javascript/tumblelog.js?625940798700868a57b49d9c8ea6f5ef"></script><meta http-equiv="x-dns-prefetch-control" content="off"/></head> <body> <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"> <div class="mainmenu"> <ul> <li><a href="/"><i class="icon-home icon-large"></i>Â <main>Home</main><desc>Sweet home...</desc></a></li> <li><a href="/ask"><i class="icon-comments icon-large"></i>Â <main>Contact</main><desc>Make your ask</desc></a></li> <li><a href="/LINK"><i class="icon-tint icon-large"></i>Â <main>Link</main><desc>Subtitle</desc></a></li> <li><a href="/LINK"><i class="icon-tint icon-large"></i>Â <main>Link</main><desc>Subtitle</desc></a></li> <li><a href="/LINK"><i class="icon-tint icon-large"></i>Â <main>Link</main><desc>Subtitle</desc></a></li> <li><a href="/LINK"><i class="icon-tint icon-large"></i>Â <main>Link</main><desc>Subtitle</desc></a></li> <li><a href="/LINK"><i class="icon-tint icon-large"></i>Â <main>Link</main><desc>Subtitle</desc></a></li> <li><i class="icon-tint icon-large"></i>Â <main>Credits</main><desc>Laah</desc></li> </ul> </div>
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Wishlist Rotate Blue:
Preview [x]
1 -Â Cole isso no seu CSS:
@import url(http://fonts.googleapis.com/css?family=Merriweather+Sans); ol {counter-reset: li;list-style: none;*list-style: decimal;font: 15px 'Merriweather Sans', 'lucida sans', sans-serif;padding: 0;text-shadow: 0 1px 0 rgba(255,255,255,.5);width: 300px;margin: 0 auto;} ol ol {margin-left: 2em;} .rounded-list a {position: relative;display: block;padding: .4em .4em .4em 2em;*padding: .4em;margin: .5em 0;background: #ddd;color: #444;text-decoration: none;border-radius: .3em;transition: all .5s ease-out;} .rounded-list a:hover{background: #eee;} .rounded-list a:hover:before{transform: rotate(360deg);-webkit-transform:rotate(360deg);} .rounded-list a:before{content: counter(li);counter-increment: li;position: absolute; left: -1.3em;top: 50%;margin-top: -1.3em;background: #87ceeb;height: 2em;width: 2em;line-height: 2em;border: .3em solid #fff;text-align: center;font-weight: bold;border-radius: 2em;transition: all .3s ease-out;}
2 -Â Cole isso no seu HTML:
<ol class="rounded-list"> <li><a href="">Escreva algo aqui</a></li> <li><a href="">Escreva algo aqui</a></li> <li><a href="">Escreva algo aqui</a> <ol> <li><a href="">Escreva algo aqui</a></li> <li><a href="">Escreva algo aqui</a></li> <li><a href="">Escreva algo aqui</a></li> </ol></ol>
NOTA: Adaptado do CSS Deck [x] para disponibilizar no tumblr.
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Wishlist Click:
Preview [x]
1 - Cole isso no seu CSS:
.tasks {margin: 40px auto;width: 240px;background: white;border: 1px solid #cdd3d7;border-radius: 4px;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);} .tasks-header {position: relative;line-height: 24px;padding: 7px 15px;color: #5d6b6c;text-shadow: 0 1px rgba(255, 255, 255, 0.7);background: #f0f1f2;border-bottom: 1px solid #d1d1d1;border-radius: 3px 3px 0 0;background-image: -webkit-linear-gradient(top, #f5f7fd, #e6eaec);background-image: -moz-linear-gradient(top, #f5f7fd, #e6eaec);background-image: -o-linear-gradient(top, #f5f7fd, #e6eaec);background-image: linear-gradient(to bottom, #f5f7fd, #e6eaec);-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.03);box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.03);} .tasks-title {line-height: inherit;font-size: 14px;font-weight: bold;color: inherit;} .tasks-lists {position: absolute; top: 50%;right: 10px;margin-top: -11px;padding: 10px 4px;width: 19px;height: 3px;font: 0/0 serif;text-shadow: none;color: transparent;} .tasks-lists:before {content: '';display: block;height: 3px;background: #8c959d;border-radius: 1px;-webkit-box-shadow: 0 6px #8c959d, 0 -6px #8c959d;box-shadow: 0 6px #8c959d, 0 -6px #8c959d;} .tasks-list-item {display: block;line-height: 24px;padding: 12px 15px;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;} .tasks-list-item + .tasks-list-item {border-top: 1px solid #f0f2f3;} .tasks-list-cb {display: none;} .tasks-list-mark {position: relative;display: inline-block;vertical-align: top;margin-right: 12px;width: 20px;height: 20px;border: 2px solid #c4cbd2;border-radius: 12px;} .tasks-list-mark:before { content: '';display: none;position: absolute;top: 50%;left: 50%;margin: -5px 0 0 -6px;height: 4px;width: 8px;border: solid #39ca74;border-width: 0 0 4px 4px;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);} .tasks-list-cb:checked ~ .tasks-list-mark {border-color: #39ca74;} .tasks-list-cb:checked ~ .tasks-list-mark:before {display: block;} .tasks-list-desc {font-weight: bold;color: #8a9a9b;} .tasks-list-cb:checked ~ .tasks-list-desc {color: #34bf6e;text-decoration: line-through;}
2 - Cole isso no seu HTML:Â
<title>Task List</title> </head> <body> <section class="tasks"> <header class="tasks-header"> <h2 class="tasks-title">Wishlist:</h2> <a href="http://fe-themes.tumblr.com" title="Credits" class="tasks-lists">(c)</a> </header> <fieldset class="tasks-list"> <label class="tasks-list-item"> <input type="checkbox" name="task_1" value="1" class="tasks-list-cb" checked> <span class="tasks-list-mark"></span> <span class="tasks-list-desc">Escreva algo aqui</span> </label> <label class="tasks-list-item"> <input type="checkbox" name="task_2" value="1" class="tasks-list-cb" checked> <span class="tasks-list-mark"></span> <span class="tasks-list-desc">Clique em cima</span> </label> <label class="tasks-list-item"> <input type="checkbox" name="task_3" value="1" class="tasks-list-cb"> <span class="tasks-list-mark"></span> <span class="tasks-list-desc">Se usar, credite!</span> </label> </fieldset> </section>
NOTA: Adaptado do CSS Deck [x] para disponibilizar no tumblr.
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Wishlist Interativa:
Preview [x]
1 - Cole isso no seu CSS:
.box {background: rgba(255,255,255,.6); padding: 5px; font-family: Verdana, Geneva, sans-serif; font-size: 8pt; color: #696969;text-align: justify;margin-bottom: 5px; border-radius: 5px;} <h1>Animated checkboxes using iconfonts</h1> @import url(http://thecodeplayer.com/uploads/fonts/fontawesome/css/font-awesome.min.css); @import url(http://fonts.googleapis.com/css?family=Montserrat); {margin: 0; padding: 0;} h1 { font-size: 16px; padding: 15px; text-align: center;} ul { width: 290px; margin: 0 auto; } ul li { list-style-type: none;padding: 10px; } label { position: relative; padding-left: 30px; font-size: 14px; cursor: pointer; } label:before, label:after { font-family: FontAwesome; font-size: 21px; /*absolutely positioned*/ position: absolute; top: 0; left: 0; } <input type="checkbox" name="one" id="one" /> <label for="one">Create checkbox</label> <input type="checkbox" name="two" id="two" /> <label for="two">Assign label</label> <input type="checkbox" name="three" id="three" /> <label for="three">Import iconfont</label> <input type="checkbox" name="four" id="four" /> <label for="four">Iconify label pseudo elements</label> <input type="checkbox" name="five" id="five" /> <label for="five">Animate icon widths</label> <input type="checkbox" name="six" id="six" /> <label for="six">Color the icons</label> max-width: 0; overflow: hidden; opacity: 0.5; transition: all 0.35s; } input[type="checkbox"] { display: none; } input[type="checkbox"]:checked + label:after { max-width: 25px; opacity: 1; } #one+label:before, #one+label:after {color: hsl(0, 45%, 40%);} #two+label:before, #two+label:after {color: hsl(60, 45%, 40%);} #three+label:before, #three+label:after {color: hsl(120, 45%, 40%);} #four+label:before, #four+label:after {color: hsl(180, 45%, 40%);} #five+label:before, #five+label:after {color: hsl(240, 45%, 40%);} #six+label:before, #six+label:after {color: hsl(300, 45%, 40%);}
2 - Cole isso no seu HTML:
<div class="box"> <h1>Wishlist Interativa</h1> <center><ul><li> <input type="checkbox" name="one" id="one" /> <label for="one">Escreva aqui o que quer</label> </li><li> <input type="checkbox" name="two" id="two" /> <label for="two">Escreva aqui o que quer</label></li> <li> <input type="checkbox" name="three" id="three" /> <label for="three">Escreva aqui o que quer</label></li> <li> <input type="checkbox" name="four" id="four" /> <label for="four">Escreva aqui o que quer</label></li><li> <input type="checkbox" name="five" id="five" /> <label for="five">Escreva aqui o que quer</label></li><li> <input type="checkbox" name="six" id="six" /> <label for="six">Escreva aqui o que quer</label></li></ul> </center></div>
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
Capas para youtube:Â âModern Coupleâ
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 056
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 055
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 054
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 053
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 052
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!
#PSD 051
Download:Â [x]
Se usar,for Ăștil e/ou baixar, dĂȘ like e credite!