Grey: A New Free HTML5/CSS3 WordPress Theme. Nik and I have been busy working on our first WordPress theme exclusively for webexpedition18 readers.
Grey theme was built to have an elegant, out of the box, design with a strong core layout structure. Grey is generic enough to be used for almost any kind of blog. Whether you’re looking to setup your own design blog, a blog about photography, fashion or whatever your passion, the Grey theme should suit your needs. It is built on a simple layout, but with lots of little touches of subtle detail and texture. HTML5 / CSS3 ThemeCSS3 features: border-radius, multiple backgrounds, text-shadow, box-shadowCompatible with 3.0+ WordPress versionsGrey Options PanelBuilt-in Twitter and Flickr streamSupports threaded commentsWidgets readyAuthor BoxEnhanced with jQuerySEO orientedTested in Firefox, Safari, Chrome, Opera, IE8+Free Now let’s take a closer look at this awesome WordPress theme. Layout is created using new HTML5 tags. Headernavsectionarticlefooteretc. Sidebar supports widgets. Complete Image Size Chart For Facebook, Twitter, Pinterest, YouTube & Other Social Networks.
If your world is social media or music, subscribe to one of Hyebot's free feeds and get involved in our community.
Good design has never been more important. But recent changes to Facebook pages, Twitter headers, YouTube channels and other social sites has made it rather difficult to get the size of your images just right. So bookmark this page, and the next time you're about to post a picture or change your profile image, refer to this handy cheat sheet. chart by LunaMetrics via Econsultancy. Industrial Free Fonts. 3D logo Tutorial. Many people asked me how to do this, heres your awnser, with only illustrator and photoshop you can do almost anything.
In this Tutorial you will start with the making of a logo shape, going to rough 3D, and finishing it in Photoshop. This is so easy that even the starting beginner can do it. Create a new web document doesn't matter the resolution since we are working in Vectors here, just remember to use RGB. Now with your document created lets go to the tool bar and pickup the Elipse tool or hit (L) on your keyboard, remember to hold down shift while doing this circle so it stays perfect. Go to the top of your screen, take off the Fill color choose None, and put a stroke of 25pt. Now that we got our Circle done lets make a Fill instead of a stroke. See.. Get the line segment tool, and make vertical line, set the background to none, put the stroke to 25pt as our circle, finally go to Object -> Expand.
But we aren't done. Make a simple square and rotate it like this. Modern 3D Text Effect. Introduction In this Photoshop tutorial we’re going to step outside my usual Photoshop Only philosophy and use the 3D rendering power of Adobe Illustrator to create a cool little 3D text effect.
Don’t worry noobs, you don’t need to know anything about Illustrator, as usual I’ll coach you through the whole process, but you do need to have it installed on your computer. (*note: If you don’t have Illustrator, you can jump over to Adobe.com and download a 30 day trial version to play around with.) Step 1 – Setting Up The Photoshop File Lets get started by opening a new Photoshop document by choosing File > New from the Main Menu or by using the keyboard shortcut Command-N (PC: Ctrl-N). Step 2 – Convert Text To Paths. How To: CSS3 3D Flip Effects – Tom Maitland. 02 May 2012 Note: This post was written on an older version of the site.
I’ll get a working demo up soon. Building this site gave me an excuse to try out some CSS3 3D transformations. Once you get how they work, they’re surprisingly easy and quite powerful. It sure beats trying to build with jQuery. For this site, I built a simple flipping circle that you can try out in a WebKit (Chrome / Safari) or Mozilla browser by hovering over my photo on the right. When your mouse hovers over the widget itself the circle does a quick wiggle so you know it does stuff.Hovering over the circle activates the effect.Hovering over the email icon makes it slowly fade in and out (pulsate). The effects on 1 & 3 are created using keyframes and deserve their own post, so let’s focus on that swish circle for now. Before I jump into the code, keep in mind that these effects are part of CSS3 which is still a draft standard. Ok! Break It Down Now HTML Structure The CSS Foundations Adding the CSS Sparkle Final CSS Styles.