For the discerning designer in us all, no detail is too small. From the slightest border and box-shadow adjustments to pixel-perfect grid-based systems, the modern web poses a number of design challenges and options for even the most basic of projects. The good folks at BCCO have put in the time to develop the Epic Favicon Generator, to help designers quickly create crisp favicons to accommodate standard desktops, smartphones and retina displays. The generator creates the icons and the necessary HTML tags to quickly and correctly implement the favicons into your project.
CSS reset rules have been around for years, helping designers to restore the baseline styles that pesky browser’s like to apply across the board. The Marx Stylish CSS Reset is a raw CSS based reset stylesheet that doesn’t rely on scripting or classes to get the job done. It is a lightweight and simple reset, best suited for projects that do not rely on attribute-heavy frameworks. Author Matthew Blode took care to ensure that base styles included clean typography and are fully responsive as well as mobile friendly. By avoiding the use of classes, the stylesheet is ready to be included directly with little customisation needed to bring the clean style rules to your next project.
Icons have held a special place in designers hearts for years and for good reason. They bring consistency across a design in ways that few other design elements can. Hüseyin Yilmaz created the Icons V.3 pack to bring cartoonish features to breathe some life into common-place icons such as drop down menus, zoom icons and email markers. The 24-piece icon set is available for free for both commercial and personal use and includes Illustrator, SVG, .TTF as well as preview versions in HTML and CSS so you can quickly include the icons in your latest design project.
Developing and designing for HTML emails comes with a specific set of design issues to tackle. Thanks to the numerous inconsistencies across email clients and software, even the best planned email can quickly be ruined by a pesky setting by on the recipient’s end. The team at Litmus put together this tutorial
“How to Code A Live Dynamic Twitter Feed in HTML Email“ to inspire developers and to think outside the box when it comes to HTML email design and execution by creating a dynamic twitter feed right in the body of an email. The tutorial walks through the use of some advanced CSS concepts and techniques to address the inconsistencies across browsers and clients.
Grid systems help designers organise the many elements on a webpage by bringing order and structure to complex layouts. Flexible.gs by Dogukan Güven Nomak is a lightweight and flexible grid system designed to work seamlessly within other frameworks like bootstrap or foundation, or incorporated into a custom stylesheet. The Flexible Grid System is based off a customizable 12-column layout and also includes a number of built-in classes to target the many different device widths found across the modern web. Versions of Flexible.gs are available for both SASS and LESS preprocessors as well as Stylus.