Luomo is an expressive, responsive theme for Tumblr created by Pixel Moxie. Luomo is designed to display your media at large sizes in big style, giving you great control over each post color palette. With Luomo, you can tailor each post to complement the way your content looks and feels. Luomo adapts to the screen size of the device you’re using to view it—your content will look awesome on any device.
Luomo is now retina ready, and includes HiDPI icons and graphics. The images and icons used on Luomo user interface are neatly organized on standard and high resolution sprites, and their PSD sources are included for you to modify if necessary.
In Luomo, posts in the index page alternate between dark and light. You can define background, text and accent colors for the generic dark and light posts—but that’s just the tip of the iceberg. Luomo comes with a predefined array of colors, allowing you to set a post background color by simply tagging it with that particular color name. You can access different variations of a color using the tags “desaturate”, “darken” and “lighten”—so, a post containing the tags #blue #darken #desaturate, will have a darker and less saturated hue of the color blue. And that’s not all—you can even break free of the included color palette by using a set of custom tags targeting individual post colors. Read more about colors in the customization section.
Luomo features an icon-based post filter that fallbacks to an stylized dropdown menu on smaller screens. The filter includes items for each post type—including “answer”, which is disabled by default in the dashboard when you first install the theme. To make your posts filterable, simply tag them according to their type: “text”, “photo”, “quote”, “link”, “chat”, “audio”, “video” and “answer”. You can enable or disable any individual filter at any time.
Since version 1.2 you can set the “label” and “slug” for each post type.
Now you can choose to display text instead of icons on the post filter menu, change each item “label” and “slug”, and even define up to ten custom tags of your own!
Photosets in Luomo are implemented using the excellent and responsive FlexSlider jQuery plugin—your images will look awesome at any screen size.
Retrieve tweets based on your twitter handle or using a custom query. Populate your Flickr feed with photos from an individual user account or a group pool.
Luomo now allows you to display your shots from Instagram and Dribbble as well!
Since version 1.2.1 Luomo offers a more seamless integration with the new SoundCloud audio embed HTML5 widget. The custom HTML5 audio player is still available for audio files hosted on Tumblr.
Now you can also share music from Spotify, in addition to SoundCloud. Luomo Spotify embeds are responsive and adapt to any screen size.
Now you can optionally replace Tumblr's default Flash audio player for an HTML5 alternative powered by jPlayer. Your audio files will play smoothly in any device that plays MP3 files natively or supports Flash. This is a great improvement over the last version, especially for those users visiting your site from a mobile device.
Since version 1.2.1 you can replace the old Twitter widget with Twitter Embedded Timeline.
Includes support for comment count and comments.
Define a custom font stack (native fonts) for body text and Google Web Fonts families and weights for posts and footer headings.
If your content gets a little too wide, you can disable the two wider media queries that cater to larger screen sizes.
Upload your own logo image (standard and HiDPI versions) and set its width and height. Use the provided logo PSD templates if you need help placing the logo in the allocated space.
At any time, you can enable or disable most of the theme features by simply toggling a checkbox on your dashboard.
Luomo offers support for the following Tumblr post types: text, photo/photosets, quote, link, chat, audio, video, and answer.
Create your custom static pages in the dashboard and add a link to them so they show up on the Navigate section on the blog footer. Luomo offers support for Ask and Submit pages as well.
Luomo is compatible with all modern browsers and devices, including: Firefox, Chrome, Internet Explorer 9, Safari, iPhone, iPad and Android.
Login to your Tumblr account and head on to your dashboard (http://www.tumblr.com/dashboard)
Click on the Settings icon at the top and then on the tab of the Blog you want to install the theme on.
On the Blog settings page, click on the Customize button on the Theme field.
On the customization dashboard, click on Edit HTML.
Open the archive you downloaded from Themeforest and find the file named: pixelmoxie-luomo-1.2.0.html (its located in the folder named theme). Do not double click on it—if it opens on the web browser you’ll see an ugly, garbled mess. Right-click (control-click on a Mac), and open the file on your favorite, no-frills text editor. Copy all the contents of the file and paste them on your dashboard sidebar.
Important: If using TextEdit on a Mac, you want to check Ignore rich text commands in HTML files on the preferences, or TextEdit will mess up your HTML source. Follow the instructions listed here if having trouble.
Click on Update Preview (CTRL+S). Your blog should start looking like Luomo. If the preview doesn’t look quite right, it’s because Tumblr hasn’t recognized and applied the theme’s variables yet. It’ll all be fine after you save your changes and refresh your browser window.
Click on the Appearance button and you’ll be taken to the main sidebar. Under the Advanced section, make sure to uncheck “Use optimized mobile layout”.
Luomo has been designed to adapt to different screen sizes, and you want to make sure visitors using mobile devices will see your site as you intended. Save your changes by clicking the Save button and then refresh your browser window (F5 or CMD + F5).
Congratulations! Your Tumblr theme is now installed.
Jump To:
Now you can make Luomo your own. Below is a screen grab of the available theme options and some notes and hints on customization.
The first step on making your Tumblr site unique should be to brand it with your own logo. You need to upload your logo as a PNG image with a transparent background. The default logo is 300px wide by 140px tall. Your logo can be any size, but it’s recommended that is no wider than that. You’ll also need to specify your logo’s dimensions for it to display correctly.
You can optionally upload a HiDPI version of you logo and that image will be shown on retina displays and other devices with High DPI screens.
Important: If you don’t upload a HiDPI version of you logo, you need to clear the default one by clicking the the “clear” button next to the Logo HiDPI field, otherwise Luomo default logo will be shown on those devices.
Make use of the included PSD logo templates if you need help with logo placement. It’s recommended that you include the necessary whitespace around the logo in your image—however, you can tick the “Enable Extra Padding Around Logo” option if you need a little breathing space above and below.
In the psd folder you‘ll find the files logo.psd and logo@2x.psd.
Open the logo.psd file, pick the font of your choice and type the name of your blog. Or if you have your logo in a raster or vector format already, place it on the document and center it on the x and y axis. Trim the unnecessary transparent pixels but make sure to leave enough whitespace so your logo can “breathe”. Make sure to center the logo vertically and that the margins on the left and right are identical.
Repeat the same process for the HiDPI version of you logo, or upscale the image by 200% and export it as “logo@2x.png”. Then upload both versions of your logo on the customization sidebar.
The font used on the included PSD is called Mission Script by Lost Type and you can download it here.
The following site-wide options will define the colors applied to your blog header and footer.
| Variable name | Description | Default value |
|---|---|---|
| Header Background | Header main background color | #f5f5f5#f5f5f5 |
| Mobile Filter Label Background | Background color of the mobile filter label | #f2f2f2#f2f2f2 |
| Mobile Filter Label Border | Border color of the mobile filter label | #d9d9d9#d9d9d9 |
| Mobile Filter Label Inset | Color of the mobile filter 1px inset highlight | #ffffff#ffffff |
| Mobile Filter Dropdown Bg | Background color of the mobile filter dropdown menu | #d9d9d9#d9d9d9 |
| Mobile Filter Dropdown Bg Hover | Background color of the mobile filter menu items when hovered | #cccccc#cccccc |
| Mobile Filter Text Color | Text color of the mobile version of the filter | #666666#666666 |
| Mobile Filter Text Color Hover | Text color of the mobile filter items when hovered | #333333#333333 |
| Desktop Filter Border | Color for the desktop filter top border | #cccccc#cccccc |
| Desktop Filter Item Bg | Background color of the desktop filter items | #cccccc#cccccc |
| Desktop Filter Item Bg Hover | Background color of the desktop filter items when hovered | #999999#999999 |
| Desktop Filter Text Color | Color for the desktop filter text | #f5f5f5#f5f5f5 |
| Footer Background | Background color of the blog footer | #343332#343332 |
| Footer Text | Text color of the blog footer | #9a9998#9a9998 |
| Footer Link | Text color of the blog footer hyperlinks | #f5f5f5#f5f5f5 |
| Footer Link Hover | Text color of the footer hyperlinks when hovered | #00ccff#00ccff |
| Pagination Background | Background | #40403f#40403f |
| Pagination Text | Text color of the footer pagination | #f5f5f5#f5f5f5 |
| Disqus Thread Accent | Accent color for the Disqus thread—it will be applied to all hyperlinks | #00ccff#00ccff |
Posts in Luomo will alternate between dark and light. By default, odd posts will be darker, while even posts will be lighter. You can “force” a post to be dark or light by using the “dark” or “light” tag on that particular post. The following variables control the posts generic palette.
| Variable name | Description | Default value |
|---|---|---|
| Dark Post Background | Background color of the dark posts | #494f50#494f50 |
| Dark Post Text | Text color of the dark posts | #f5f5f5#f5f5f5 |
| Dark Post Accent | Background color of the dark posts info bar items when hovered | #00ccff#00ccff |
| Dark Post Link | Text color of the dark posts hyperlink | #00ccff#00ccff |
| Dark Post Link Hover | Text color of the dark posts hyperlinks when hovered | #f5f5f5#f5f5f5 |
| Dark Post Link Hover Bg | Background color of the dark posts hyperlinks when hovered | #333333#333333 |
| Light Post Background | Background color of the light posts | #afb5b6#afb5b6 |
| Light Post Text | Text color of the light posts | #333333#333333 |
| Light Post Accent | Background color of the light posts info bar items when hovered | #00ccff#00ccff |
| Light Post Link | Text color of the light posts hyperlinks | #007A99#007A99 |
| Light Post Link Hover | Text color of the light posts hyperlinks when hovered | #333333#333333 |
| Light Post Link Hover Bg | Background color of the light posts hyperlinks when hovered | #f5f5f5#f5f5f5 |
| Slider Control Nav Normal | Color of the photoset slider navigation controls | #333333#333333 |
| Slider Control Nav Hover | Color of the photoset slider navigation controls when hovered | #f5f5f5#f5f5f5 |
Luomo comes with a built-in selection of colors you can use on individual posts. To color a particular post, simply tag it with the name of one of the predefined colors. Please note that this will change the post background color only—other values like text and hyperlinks colors will be unaffected. The included palette consists of sixteen named colors, and desaturated, darker and lighter variations. To access the variations, use the “desaturate”, “darken” and “lighten” tags alongside the particular color. The chart below shows each color and its variations with their corresponding tags.
For example, a post with the tags #desaturate #darken #lime could look like this.
If you feel like none of the included colors is right for your post, or want your accent and link colors to complement its background, you can get really specific by using the following tags, where xxxxxx is the color hexadecimal value.
| Variable Name | Description |
|---|---|
| bg_xxxxxx | Color of the post background. |
| info_xxxxxx | Color of the post info bar background. |
| accent_xxxxxx | Post accent color. It applies to the info bar items when hovered and to hyperlinks, if a specific color is not set. |
| link_xxxxxx | Color of the post hyperlink text. |
No matter what background color your posts has, Luomo will try to make its text readable by “guestimating” the background color luminosity and applying the corresponding CSS classes. Sometimes though, even the best guess can be a mismatch, or even if correct, you may prefer dark or light text against your chosen background. Remember—you can always “pin” a post as light or dark by adding the “dark” and “light” tags. A dark post will always show light text and icons over a dark background, while a light post will do the opposite.
For example, a post with the tags #bg_5ebdb8 #accent_ff1a40 #link_ffffff would look like this.
Luomo uses your operating system’s fonts for body text, and you can specify your desired font stack. The default one is "Segoe UI", Tahoma, Helvetica, sans-serif.
Here’s a few sans-serif font stacks that could also work well.
Futura, "Trebuchet MS", Arial, sans-serif;
"Gill Sans", "Gill Sans MT", Calibri, sans-serif;
"Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
"Helvetica Neue", Helvetica, Arial, sans-serif;
Verdana, Geneva, sans-serif;
"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
Segoe, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
Tahoma, Geneva, Verdana, sans-serif;
You can choose from Google’s vast library of fonts for some of this theme elements—simply enter the font family name and weight into the corresponding text fields. The following fonts options can be edited.
| Variable Name | Default values |
|---|---|
| Post Header Font Family | Open Sans |
| Post Header Font Weight | 600 |
| Post Header Text Transform | none|capitalize|uppercase|lowercase |
| Post Filter Font Family | Open Sans Condensed |
| Post Filter Font Weight | 600 |
| Post Filter Font Size | 16 |
| Post Filter Text Transform | none|capitalize|uppercase|lowercase |
| Post Info Font Family | Open Sans Condensed |
| Post Info Font Weight | 700 |
| Footer Header Font Family | Open Sans |
| Footer Header Font Weight | 300 |
| Footer Header Text Transform | none|capitalize|uppercase|lowercase |
| Pagination Font Family | Open Sans |
| Pagination Font Weight | 400 |
In the example below, the font family name would be Dosis, and its weight 600.
Head over http://www.google.com/webfonts to discover more fonts. This theme uses Open Sans and Open Sans Condensed by default, in various weights. We love it as it’s a nice looking, versatile, well executed font.
Here’s a few ones that work well for the posts and footer headings.
For the post info bar, a narrower or condensed typeface is needed, as there’s quite a bit of info to display. We feel Open Sans Condensed works great for this. Dosis is another great alternative.
You can define font sizes for body text and headings for phones, tablets and desktop devices
| Variable Name | Default values |
|---|---|
| Body Font Size Phone | 16 |
| Body Font Size Tablet | 18 |
| Body Font Size Desktop | 24 |
| Post Header Font Size Phone | 18 |
| Post Header Font Size Tablet | 27 |
| Post Header Font Size Desktop | 36 |
| Footer Font Size | 14 |
| Footer Header Font Size | 24 |
If you ever feel your content is getting too wide, you can disable media queries as you see fit, making the desktop version of your site closer in look to the mobile experience. Media queries should be disabled sequentially, unchecking the corresponding options in the following order:
| Enable 1440px Media Query |
| Enable 1280px Media Query |
| Enable 1024px Media Query |
The menu underneath the logo allows visitors to filter your posts by tags that match Tumblr post types. To make your posts filterable, simply tag them according to their type. On your dashboard, you can enable or disable any individual post type by checking/unchecking the options “Enable Post Filter x” (Answer is unchecked by default.)
As of version 1.2, Luomo allows you to define both the ‘label’ and the ‘slug’ to be used with each one of the icon based post filter menu items. That means that you can keep using the same icons as always, but having them point to an user defined tag of your choice.
For example, setting the options ‘Filter Label Photo’ to ‘kitten pics’ and ‘Filter Slug Photo’ to ‘pictures’, would mean that the photo icon would now point to http://pixelmoxie-luomo.tumblr.com/tagged/pictures, and when hovered, ‘kitten pics’ will be the displayed tittle.
As of version 1.2, Luomo includes the option to use just text for your post filter menu and do away with the icons altogether. To do that, you need to check the option ‘Enable Text Based Post Filter’.
When using this option, you can define both the text to be shown for each post type (the label) and the actual tag the link should target (the slug). You’re not longer limited to the Tumblr default post types either, now Luomo gives you the option to set up to ten user defined tags of your choice. Remember that the standard tags can be disabled individually, and user defined tags will always show up after them on the menu.
Important: if you set user defined tags for the filter, the “text based post filter” must be enabled. Those items won’t show up when using the “icon based post filter”.
When using the text based post filter, you may want to adjust the relevant color variables to taste. We find that dark text on a light background works better in this case.
If the text based menu gets too wide, you can enable the mobile version of the filter (dropdown) for the wider layouts too. the following options should be enabled sequentially, as needed:
| Enable Mobile Filter For 1024px Layout |
| Enable Mobile Filter For 1280px Layout |
| Enable Mobile Filter For 1440px Layout |
| Enable Mobile Filter For 1600px Layout |
These are the variables related to the new filter functionality, introduced in version 1.2:
| Variable Name | Description |
|---|---|
| Filter Custom Label [1-10] | User defined labels for the post filter. |
| Filter Label Text | Label for the “Text” post type. Will be shown on the mobile menu and on the desktop menu tooltip. |
| Filter Label Photo | Label for the “Photo” post type. |
| Filter Label Quote | Label for the “Quote” post type. |
| Filter Label Link | Label for the “Link” post type. |
| Filter Label Chat | Label for the “Chat” post type. |
| Filter Label Audio | Label for the “Audio” post type. |
| Filter Label Video | Label for the “Video” post type. |
| Filter Label Answer | Label for the “Answer” post type. |
| Filter Slug Text | The “slug” (last segment on the URL the menu item points to) for the “Text” post type. You’ll need to tag your posts accordingly if you change this value. |
| Filter Slug Photo | The “slug” (last segment on the URL the menu item points to) for the “Photo” post type. |
| Filter Slug Quote | The “slug” (last segment on the URL the menu item points to) for the “Quote” post type. |
| Filter Slug Link | The “slug” (last segment on the URL the menu item points to) for the “Link” post type. |
| Filter Slug Chat | The “slug” (last segment on the URL the menu item points to) for the “Chat” post type. |
| Filter Slug Audio | The “slug” (last segment on the URL the menu item points to) for the “Audio” post type. |
| Filter Slug Video | The “slug” (last segment on the URL the menu item points to) for the “Video” post type. |
| Filter Slug Answer | The “slug” (last segment on the URL the menu item points to) for the “Answer” post type. |
| Enable Post Filter [post type] | Enable or disable the filter for individual post types. |
| Enable Mobile Filter For [1024, 1280, 1440, 1600]px Layout | Display the mobile version of the post filter (dropdown) on larger screen resolutions. Useful when the menu gets too wide otherwise for certain layouts. |
| Enable Desktop Filter Dark Icons | Useful when using a dark color for the menu items background. |
Check the Enable HTML5 Audio PLayer option to replace Tumblr Flash player for an HTML5 player for Audio posts (hosted on Tumblr or SoundCloud embeds). Browsers that can natively play MP3 files include: Safari, Mobile Safari iOS4 (iPad, iPhone, iPod), Chrome and IE9. Firefox and Opera do not support MP3 files and will use a Flash solution, so they need to have the Flash plugin installed if this option is active.
Drawback: when using the HTML5 audio player, play count won’t increment with each play and thus it won’t be shown.
You can disable at will individual footer columns and widgets. Here's a rundown of the related options.
| Variable Name | What it does |
|---|---|
| Enable Footer Copyright | Enable the footer copyright notice |
| Enable Footer Credits | Enable the footer theme credits |
| Enable Footer First Column | Enable the footer first column |
| Enable Footer Second Column | Enable the footer second column |
| Enable Footer Third Column | Enable the footer third column |
| Enable About Widget | Enable the footer About Widget |
| Enable Dribbble Widget | Enable the footer Dribbble Widget |
| Enable Flickr Widget | Enable the footer Flickr Widget |
| Enable Instagram Widget | Enable the footer Instagram Widget |
| Enable Navigation Widget | Enable the footer Navigation Widget |
| Enable Twitter Widget | Enable the footer Twitter Widget |
| Move About Widget To Column [2, 3] | Move the About Widget from its default location |
| Move Dribbble Widget To Column [1, 2] | Move the Dribbble Widget from its default location |
| Move Flickr Widget To Column [1, 2] | Move the Flickr Widget from its default location |
| Move Instagram Widget To Column [1, 2] | Move the Instagram Widget from its default location |
| Move Navigation Widget To Column [2, 3] | Move the Navigation Widget from its default location |
| Move Twitter Widget To Column [1, 3] | Move the Twitter Widget from its default location |
Enter your Twitter Username and, optionaly, a custom Twitter Query (for example: “pixelmoxie-supple.tumblr.com” or “illustration design art”) and then enable the Twitter Widget. Set the number of tweets to retrieve in the Twitter Count field and the title to display on above your tweets in the Twitter Widget Title field.
Use this tool to find your Flickr user or group id. Just enter the address of your photostream or group pool and it’ll find the number for you.
Enter your Flickr ID and then enable the Flickr widget. You can use an individual or group pool ID, but if pooling from a group, you need to enable the option Enable Flickr Group Feed to switch to the right API. Set the number of images to retrieve in the Flickr Count field.
Displaying shots from your Dribbble account is just as easy. Make sure the Dribble widget is enabled and enter you Dribbble Username. Edit the fields Dribbble Count and Dribbble Widget Title to control the numbers of shots to display and the text shown above them.
Displaying your Instagram feed requires an extra piece of info, but thanks to this tool this is quite easy as well. Besides your Instagram User ID, you’ll need an Instagram Access Token. Go to http://projects.craftedpixelz.co.uk/jqinstapics/, scroll down and press the Retrieve my details bro! button to get your details and complete the fields with the corresponding info. Edit the Instagram Count and Instagram Widget Title if needed.
Twitter decision to discontinue their unauthenticated v1.0 API means that the current Twitter widget will stop working at sometime in 2013. To fill the gap until a suitable replacement is found, or if you prefer that over the old Twitter widget, you can enable Twitter Embedded Timeline on your site footer.
Create your own embedded timeline using the new timeline settings page on twitter.com. Make sure to customize your widget (dark or light theme, link color, height, domain to embed the widget on) and once you’re done, grab the generated code.
Back on Tumblr customization sidebar, look for the option “Twitter Embedded Timeline Code”, and paste the code in that field. Now the old Twitter widget should be replaced with Twitter’s interactive timeline on your blog footer.
| Variable Name | Description | Default value |
|---|---|---|
| Ask Label | Label for the “ask me anything” link on the blog footer | Ask me anything |
| Submit Label | Label for the “submit a post” link on the blog footer | Submit a post |
| Categories Dropdown Title | Displayed on the mobile version of the post filter | Categories |
| About Widget Title | Title for the footer About Widget | About Me |
| Dribbble Widget Title | Title for the footer Dribbble Widget | Dribbble Shots |
| Flickr Widget Title | Title for the footer Flickr Widget | Latest From Flickr |
| Instagram Widget Title | Title for the footer Instagram Widget | Instagram |
| Twitter Widget Title | Title for the footer Twitter Widget | Latest Tweets |
Social icons will be displayed on the site header for the following sites/services, if not left blank. The option Enable Social Links need to be checked.
Behance, Dribbble, Facebook, Flickr, Google+, Instagram, LastFM, LinkedIn, MySpace, Picasa, Pinterest, SoundCloud, Twitter, Vimeo, YouTube, and deviantART.
| Variable Name | Description |
|---|---|
| Google Analytics ID | The tracking code for your Google Analytics account. |
| Adtdhis Profile ID | Enter your Adtdhis Profile ID to have access to analytics reports. |
| Enable Audio ID3 Info | Show or hide ID3 info from audio posts. |
| Enable Blog Description | Show or hide your blog description on the footer. |
| Enable Centered Logo | Keeps the logo and social media icons centered at any screen size. |
| Enable Click Through Photos | Clicking on photos takes you to the full-size image or a user defined target. |
| Enable Extra Padding Around Logo | Add an extra 20px padding above and below the logo if you need a little breathing space. |
| Enable Flickr Group Feed | Only enable this if your Flickr ID corresponds to a group pool, as opposed to an individual user. |
| Enable HTML5 Audio PLayer | Swaps the default Flash audio player for an HTML5 compatible one. |
| Enable Image Feed Alt Styling | Alternative styling for the footer’s image feeds, with extra spacing |
| Enable Linkable Quotes | If this is checked, quotations text will act as a permalink to the full post. |
| Enable Post Content Source | Show or hide info about the page where the content was originally posted. |
| Enable Post Notes | Show or hide post notes on permalink pages. |
| Enable Post Reblogged From | Show or hide original source from reblogged posts. |
| Enable Post Sharing | Show or hide sharing link on post info bar (Adtdhis popup). |
| Enable Post Tags | Show or hide post tags on the post footer. |
| Enable Social Links | Show or hide all of the social links on the blog header. |
| Enable Twitter Avatar | Show or hide the twitter user avatar on the Twitter Feed. |
| Posts Per Page | Set the number of posts per page to display (Under the “Advanced” section). |
| Add custom CSS | Add your own CSS rules to modify the look of your site without touching the source code—for advanced users only! |
I you fine-tune the color of the text for the dark and light posts, you may want to change the icons to match. Inside the psd folder, you will find the following files:
| luomo_icons.psd |
| luomo_icons@2x.psd |
| social_icons.psd |
| social_icons@2x.psd |
Make your changes and then export the normal and high DPI sprites as PNG images with transparency, then use the upload buttons in the customization sidebar to upload the new files.
Thank you for purchasing our theme, your support is more than appreciated!
If after reading this guide you still need help setting up your theme, or if you find a bug that needs to be ironed out, you’re welcome to contact us through our ThemeForest profile page.
Although this theme officially supports Internet Explorer 9 and up and other moderns browsers, some measures have been taken so the site doesn’t look completely broken on older versions of IE. Internet Explorer 7 and 8 will be served the mobile layouts with a very basic styling—color customizations will not apply—so it won’t look as pretty, but content should be perfectly accessible nonetheless.
The following resources have been used in the making of this theme:
Sass – http://sass-lang.com/
Compass – http://compass-style.org/
normalize.css – http://necolas.github.com/normalize.css/
Frameless Grid – http://framelessgrid.com/
Open Sans – http://www.google.com/webfonts/specimen/Open+Sans
Open Sans Condensed – http://www.google.com/webfonts/specimen/Open+Sans+Condensed
Iconic – http://somerandomdude.com/work/iconic/
FlexSlider 2 – http://www.woothemes.com/flexslider/
Tweet! – http://tweet.seaofclouds.com/
Jflickrfeed – http://www.gethifi.com/blog/a-jquery-flickr-feed-plugin
Jribbble – http://lab.tylergaw.com/jribbble/
jQInstaPics – http://projects.craftedpixelz.co.uk/jqinstapics/
FitVids – http://fitvidsjs.com/
Reveal – http://www.zurb.com/playground/reveal-modal-plugin
jPlayer – http://jplayer.org/
Simon Bouchard’s Stock Images
http://www.flickr.com/photos/simon-bouchard/sets/72157624798241210/
Sakura by Petr Kratochvil
Seabed by Petr Kratochvil
White Sands 7 by Kondo Yukihiro
Macaw by juditu
Wonderland by AD-Passion
Pin-up by Patrick Hitte