background preloader

CSS3 Generator - By Peter Funk & Eric Hoffman

CSS3 Generator - By Peter Funk & Eric Hoffman

http://www.css3.me/

Grid Designer 2 If you're familiar with the grid, a bit of design and basic typography, using this script should be pretty easy - most of the functions are pretty self-explanatory. If you're unfamiliar with grids in general, you could start by reading an excellent series of articles by web designer Mark Boulton. For those who want a real understanding of the theory of grids in relation to design and typography, I strongly recommend this book. On the Columns tab, you can start your design in two ways:

How To Create Depth And Nice 3D Ribbons Only Using CSS3 In this last period on PV.M Garage we have described many trends of the modern Web Design and many techniques for creating stunning and impressive web sites. In one of our tutorials we learned how to realize a nice 3D ribbon and how to play with the drop shadow in Photoshop to simulate depth in a web design layout. This is a widespread trends in recent web design: creating a 3D perception in a website and simulating a “world” in three dimensions are two great ways for the designers to play with their skills. Thanks to useful graphic softwares (2D) we can easily create 3D elements, like ribbons and shadows, but we can also reproduce 3D scene using perspective, focus, color shading and opacity. There is also the possibility of using 3D softwares, like Blender, to create some 3D objects and images that we can use in our designs.

UI Kits Last week we posted a collection of printable wireframing templates which included some for iPhone and iPad app design. These are great for communicating early mockups and ideas, but when it’s time for those ideas to make the jump from paper to the computer screen, it’s helpful to have a library of UI elements at your disposal. Since we love saving you time, we’ve found some for you. Here are 11 UI Kits for iPhone and iPad Development. iPad GUI Kit in PSD Format Basics of Photoshop: Designing a Website - Lifehacker But a design is just a design without the function. here, please notice, I'm actually speaking on a programming level, not a design level. Photoshop is pure design. Wordpress, joomla and many other out-of-the-box sites are focused mainly on the design. I've seen many people hire "designers" to build their sites simply for the flash a design brings, thus, paying simply for someones design is certainly not worth it. I agree that design is critical and is actually par with programming.

CSS3 Exciting Functions and Features: 30+ Useful Tutorials May 21 2009 With version three of CSS, many exciting features will be implemented. CSS3 leads to greater flexibility and makes it much easier to recreate previously complex effects. Many time-saving rules are being thought up for CSS3: text-shadow, box-sizing, opacity, multiple backgrounds, border-radius, border-image ,multi-column layout, etc… Although only the most modern browsers currently support these effects, it’s still fun to see what’s around the corner! Text Shadow Generator Use this CSS3 text shadow generator to easily add text shadow styles into your web project. Your browser does not support the CSS3 text-shadow property. You can still use this tool to generate the CSS3 rule, but you won' be able to see the results.

Sleek jQuery Accordion Menu Plugins and Tutorials jQuery accordion menus are menus that act like a musical accordion, with regards to their ability to expand and contract based on user interactions. This helps display additional information for the active menu items, while hiding non-relevant information from the user. Additionally, it can help add more content without sacrificing white space, leading to more usable and attractive user interface design. An Introduction To LESS, And Comparison To Sass Advertisement I’ve been using LESS1 religiously ever since I stumbled upon it months ago. CSS was never really a problem for me, in and of itself, but I was intrigued by the idea of using variables to create something along the lines of a color palette for my websites and themes. Having a color palette with a fixed number of options to choose from helps prevent me from going color crazy and deviating from a chosen style.

A 12-Step Guide to Fostering Your Creativity The Web Designer Series is supported by Wix.com, a free Flash online builder that makes website creation a breeze. Click here to create your own website now. One skill that every designer must learn — and quickly — is how to be creative on-demand. While there will always be specifications that guide a project as well as tried and true methods of solving common visual problems, one must still be able to get focused, get creative and produce work that doesn't end up looking formulaic or forced. css3 menu,animation navigation menu In this new category called “Tips and Tricks” we will introduce some quick and interesting methods around web development and web design. In today’s tip we’ll show you how to spice up your menu by adding a neat hover effect to it. The idea is to slide an image out to the right when hovering over a menu item. Each menu item (which is a unordered list item in this case) will have an anchor containing two spans and an image:

Creative CSS3 Animation Menus Being in the mood for experimenting with CSS3, I'd like to show you some creative menu hover effects in today's tutorial. The idea is to have a simple composition of elements, an icon, a main title and a secondary title, that will be animated on hover using only CSS transitions and animations. We'll be exploring some different effects for the elements.

30 free programming eBooks « citizen428.blog() Since this post got quite popular I decided to incorporate some of the excellent suggestions posted in the comments, so this list now has more than 50 books in it. BTW: I’m not very strict on the definition of “ebook”, some of them are really just HTML versions of books. [UPDATED: 2012-01-18] Learning a new programming language always is fun and there are many great books legally available for free online.

Related:  ToolsgénérateurCSSgenerator