Many of the resources below are free or very low cost, and are sure to be useful to a lot of designers and developers out there.
- Metro UI CSS
- CSS Arrow Please
- Fluid UI
- On/Off FlipSwitch
- jQuery blackCalculator
- Elena ($99+)
- Headlined ($15)
- Wide Display ($77)
- Kahlo ($136.50)
- No Color (free)
- Casper (free)
- Znikomit No 25 (Free)
- Public (€10)
- Stephanie Marie JFPro ($79)
- Ginger Snap JF ($79)
Osmek is a new type of cloud-based CMS, calling itself a “Content API”. It can be used with any programming language or framework, and on any server, and content can be distributed to multiple sites.
Metro UI CSS
Metro UI CSS is a framework for developing sites in the style of Windows 8. It can be used as a self-contained solution or added to any other CSS framework.
Strapdown.js is a simple way to create Markdown documents without requiring server-side compilation. It’s search-engine friendly, cross-browser compatible, themeable, and includes Github-style syntax highlighting.
Prism.js is an extensible, lightweight syntax highlighter that works with modern web standards. It’s blazing fast, intuitive, and can be styled with CSS.
Annotator is an open-source JS library that can be added to a webpage to let visitors leave annotations. These annotations can include comments, tags, users, and more. And it was designed with easy extensibility in mind so you can add new features.
SideTap is a framework for building mobile, platform-independent web interfaces. It works best on iOS5+, Chrome, and Safari. It’s lightweight, and embraces convention over configuration so you can get started right away.
Erlywarn gives you instant notifications if your website isn’t acting normally. It’s quick to get started (just enter your email and URL) and it’s affordable (starting at just £1/month).
BigVideo.js is a jQuery plugin for adding a big video (or image) background to your website. It uses the Video.js API, as well as a couple of jQuery plugins and libraries.
SoundGecko will convert any article into an MP2 file you can listen to on the go. It’s available as a Chrome extension, or you can just email the article URL to get the conversion. There are also apps for iOS, Android, and Windows Phone.
Edicy is a simple tool used to creating multilingual websites. It’s easy to use, optimized for desktop and mobile, has customizable themes, and is search engine optimized right out of the box.
Typecast makes it easy to create interactive live blogs, perfect for interviews. You can invite readers, friends, and fans to ask you questions, and then just choose which ones to answer and start typing.
Quabel is a browser-based writing app that lets you easily set writing goals and focus on your writing without outside distractions. Simple commands make it easy to format your writing, and it’s accessible from anywhere.
Neat is an open source fluid grid framework built on top of Bourbon and Sass. It uses em units and golden ratios, and relies entirely on Sass mixins, therefore not polluting your HTML with presentation classes and extra wrapping divs.
Human.io is a platform for building tiny mobile apps that can access a phone’s camera, geolocation, and more. You can use it to create simple or complex functionality, and it’s easy to integrate into existsing services.
Mailrox makes it easy to build bulletproof HTML emails for CampaignMonitor or MailChimp. Templates built with Mailrox have been tested with Apple Mail, Lotus Notes, Thunderbird, AOL, Gmail, Yahoo! Mail, and many more.
CSS Arrow Please
CSS Arrow Please is a quick and easy to use CSS arrow generator. Just specify the size of the arrow, the border width and color, position, and background color, and you’ll get all the code you need.
Easel is an in-browser website design tool that includes mockup and sharing features. It includes built-in web fonts and true-to-browser rendering, and you can even import your existing styles using their Chrome extension.
JZoopraxiscope is a jQuery plugin for creating animations from static images. It’s inspired by the Zoopraxiscope, created by Eadweard Muybridge.
Screenqueries is a simple tool for testing your responsive designs in various screen sizes. It includes drop down menus with a number of common devices, or you can specify your own screen size.
Fluid UI is an app for building iOS and Android app prototypes. It includes tools for sharing, uploading and exporting, and even on-device testing. There’s a limited free plan available, and paid plans start at $29/month.
On/Off FlipSwitch is a generator for creating pure CSS3 on/off flip switches with animated transitions. It includes a variety of styles, as well as settings for active and inactive states, sizing, colors, labels, and more.
Infogr.am is a free, simple app for creating awesome infographics. There are pre-designed themes to choose from, then just add your data and share or embed the finished infographic.
Gridster is a drag-and-drop, multi-column jQuery grid plugin. It lets you create draggable, dynamic layouts that you can even add and remove elements from. It’s easy to set up and includes full documentation.
jQuery blackCalculator is a jQuery plugin for creating a calculator. There are a number of definable options, as well as full documentation.
TheCodePlayer is a repository of video walkthroughs for creating a variety of awesome stuff from scratch. It offers everything from simple hover effects with CSS to creating a screensaver in HTML5 and much more.
Toast is a simple CSS framework for creating grid-based layouts. It includes type styles, a reset, and a grid, and nothing more. There are two main grid states, including a single-column grid for narrow screens and a 12-column grid for larger screens (up to 960px).
Taskup is a task list app that’s simple and flexible, helping you get organized without getting in your way. There’s a free plan that handles up to 1,000 tasks, and paid plans start at $.99/month.
EditorConfig is designed for developers to define and maintain consistent coding styles between different IDEs and editors. It works well with version control systems, and includes both a file format and a collection of text editor plugins for each project.
Sequence.js is a responsive slider that uses advanced CSS3 transitions. There’s no built-in theme, giving you complete creative control. The best part is you only need to know CSS3 to style it.
Elena, from Process Type Foundry, is a highly legible serif font designed for extended reading. It’s subtle and restrained, with a crisp, tailored tone.
Headlined is a distressed sans serif display font. It has a worn, ink-like texture that gives it a more tactile feeling while also setting it apart from similar fonts.
Wide Display ($77)
Wide Display is a unicase slab-serif font with decorative elements and numerous alternatives.
Kahlo is a formal and elegant hipster-inspired typeface. It comes with four weights and italics, as well as some alternate characters. It’s perfect for posters, logos, headlines, packaging, and more.
No Color (free)
No Color is a lightly distressed typeface with an Old West feeling to it. It’s perfect for headlines, signage, packaging, and more.
Casper is a sans serif typeface that includes arrows, alternate characters and signs, and ligatures. It includes both Latin and Cyrillic characters.
Znikomit No 25 (Free)
Znikomit No 25, from Gluk, is an elegant decorative font released under the OpenFontLicense.
Public is a display typeface perfect for signage, packaging, logos, and more. It’s quite obviously inspired by typography of the 20s and 30s.
Stephanie Marie JFPro ($79)
Stephanie Marie JFPro, designed by Jason Walcott, is a stylish script font that includes a full set of alternate caps, as well as some alternate lowercase and ligatures.
Ginger Snap JF ($79)
Ginger Snap JF is a funky display typeface that’s excellent for posters, packaging, and more.