With CSS3 & HTML5 making more and more of a presence in the design and development of WordPress themes. Today we look at 10 awesome CSS3 & HTML5 WordPress themes that you can use for your blog /website.
HTML5 is bringing modern web standards to everyone and allowing developers to really use their creative juices. Because HTML5 consists powerful functionality which supports true semantic capabilities to Web documents, augmenting their human-readable content with machine-readable data and metadata.
Spectacular is a free WordPress theme that aims to provide a warm and pleasurable atmosphere for personal musings and ramblings. The theme comes in two flavors: HTML 4.01 and HTML5. Also, both German and English versions of the theme are included in the download package. The theme is cross-browser compatible and supports Opera, Safari, Chrome, IE7+, and FF. Support for IE6 is not available, though the theme works in IE6, too.
The theme was commissioned by Smashing Magazine and designed by Maleika Esther Attawel exclusively for Smashing Magazine. As usual, the theme is absolutely free to use in private and commercial projects.
The theme is released under GPL. You can use it for all your projects for free and without any restrictions. Please link to this article if you want to spread the word. You may modify the theme as you wish.
[box_info] Download Spectacular Theme [/box_info]
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 CSS Features:
- HTML5 / CSS3 Theme
- CSS3 features: border-radius, multiple backgrounds, text-shadow, box-shadow
- Compatible with 3.0+ WordPress versions
- Grey Options Panel
- Built-in Twitter and Flickr stream
- Supports threaded comments
- Widgets ready
- Author Box
- Enhanced with jQuery
- SEO oriented
- Tested in Firefox, Safari, Chrome, Opera, IE8+
[box_info] Download Grey: A New Free HTML5/CSS3 WordPress Theme [/box_info]
The design of Temple Gate is inspired by the spirituality and simplicity of Japanese Temple Gate.
- WordPress 3.0+ ready!
- Multilingual translation ready! A “pot” (Portable Object Template) file is included for you to translate to your language.
- Main Navigation: a main navigation for pages, categories and external link menus all in one place. Configure it directly from admin.
- Theme Options (for logo, Feed icons, Twitter, Facebook profile and Google Analytics code from admin).
- Widgets ready!
- Sticky Post
- A banner section – insert image in each post using Custom Field ‘banner’.
- Show Popular Posts – Next to banner section. Required WordPress Popular Posts. Use other plugin/widget if you prefer.
- Insert image in a post/page using Custom Field. In the Excerpt mode (see example in the homepage) it shows a thumbnail size, in posts page it shows a full size image.
- Show 5 Related posts at the end of each article – required Related Posts by Category plugin
- A Links template (a.k.a Bookmarks) – extra bit of usability and SEO. This template is very useful if you have a long list of sites that you want to link to, and don’t want it shows up in the sidebar widget. Setup the page from the Pages page and select the template.
- An Archives template to display last 20 posts, posts by categories, posts by yearly and monthly. This thoughtful feature is useful if a site had been running for years and has hundreds of articles (in this case you probably don’t want the archives be displayed in the sidebar widget)
- Linking post published dates to their archives – extra bit of usability care that your reader/visitor will appreciate!
- Build with accessibility in mind: WCAG 2.0 AA and Section 508 quality
- Search Engine Optimized from ground up – structural markup and image optimization
- Highlight Author Comments by giving a different border color
- Threaded comments
[box_info] Download Temple Gate: An Accessible HTML5 WordPress Theme [/box_info]
A semantic, HTML5, canvas for CSS artists and an ultra-minimal set of super-clean templates for your own WordPress theme development.
[box_info] Download Toolbox WordPress Theme [/box_info]
Light WordPress theme based on HTML5. Has an options, like a position of a main layout and a position of a sidebars.
[box_info] Download Orange Flower WordPress Theme [/box_info]
Dreamweaver Gratuit is proud to announce its first WordPress theme, FreeDream, a HTML5 theme using some CSS3 properties. FreeDream is simple, clean and elegant, a design I made for my blog’s readers.
- HTML5 markup. It uses the HTML5 markup and the design is fine in every current browsers, including IE6.
- A specific 404 page. The 404 template of this theme provides your readers with a list of recent articles.
- Archives template. An archives template that supports categories, tags and monthly views.
- CSS3. All the rounded corner in this theme are displayed with the border radius property. But the design is perfectly fine with IE.
- Twitter. This theme allows you to provide your Twitter.
[box_info] Download FreeDream WordPress Theme [/box_info]
The H5 Theme Template provides everything you need to create beautiful themes with HTML 5 right now. H5 contains a complete set of theme files and folders, and each file has been meticulously crafted with all of the latest and greatest WordPress functionality. As a template theme, H5 is designed with easy customization and personalization in mind, serving as a solid starting point for your next HTML-5-based theme.
- H5 is completely free and licensed under GPL
- H5 is a template used to build HTML-5 themes
- H5 is built entirely with WordPress, HTML 5, and CSS 2.1
- Uses as few tags and attributes as possible
- Contains no <div>s, s, classes, or ids!
- Built with semantically sound and fully valid HTML 5
- Outputs clean, well-formatted source-code (although WordPress botches most of it)
- Just enough CSS to target key elements, provide some structure, and make it “look” like a basic theme
- Built with well-formatted and fully valid CSS 2.1 (current spec)
- Uses child, adjacent, and attribute selectors to target elements without ids or classes
[box_info] Download H5 WordPress Theme [/box_info]
Pure HTML5 theme with custom colours using css3. This theme is child-theme ready and supports WordPress 3.1, including support for aside and gallery post-formats.
[box_info] Download JustCSS WordPress Theme [/box_info]
The Travel Theme is a free theme for WordPress designed to offer travel bloggers enhanced functionality for showcasing their blog posts, images and videos. If you are a non-travel blogger, that’s OK! You are welcome to use The Travel Theme too.
- Valid HTML5
- Flickr integration – Show all your Flickr photos and albums as independent pages within your WordPress blog
- Cufon text Replacement with 25+ fonts ready to use
- 60+ Custom style shortcodes with easy to use Shortcode Generator
- 11 Custom Widgets – Sub Navigation, Popular Post, Recent Post, Related Post, Flickr, Twitter, Social Icons, Contact Form,
- Contact Info, Google maps, 125px Ad support
- 3 Layout Templates – Full Width, Left sidebar, Right Sidebar
- Colour picker – Easily change all background, features and font colours
- Twitter integration with Multiple twitter author support
- Automatic image resizing for feature, post and map images
- Cross Browser Compatible
- Custom logo replacement
- Custom Post Types for portfolio pages
- Dynamic Sidebars
- Google Map Integration
- jQuery Drop-down menu
- Lightbox with video support (flash, YouTube, Vimeo)
- Nested comment system
- Portfolio support with sort and pagination options – From 1 to 4 column portfolio layouts
- Related and popular post modules
- Style switching with color picker and multiple layout and font options
- Video Portfolio support
- Video shortcode support -HTML5 video, .mp4, .webm, .ogg, flash, YouTube, Vimeo & DailyMotion
- WordPress 3 Menu support
- WordPress multisite support
- WPML support
[box_info] Download The Travel Theme [/box_info]
HTML5 WordPress Shell is a great starting point for quickly creating WordPress Themes using HTML5
- Dynamic sidebar examples
- Custom template examples
- The mother of all WordPress BODY tags
- Smart sidebar disable
- Support for WordPress’ new new menu system
- 404 & 503 error pages
- modernizr (html5 feature detection)
- HTML5 reset stylesheet
- A well thought out HTML5 document outline which is good for SEO and Accessibility
- @font-face examples
- iPhone detection
- IE conditional stylesheets
- Clearly commented code
- lots of useful CSS classes in the basic.css stylesheet
- ie6 upgrade message
[box_info] Download HTML5 WordPress Shell [/box_info]
Have you come across a HTML5 CSS3 theme that you would like listed? Add to the comments below.