The Best 20+ Online Creative Design Tools Including Awesome HTML & CSS Generators

Amazing what you can find online these days…yup yup yup pretty much anything that comes to mind, ya can most certainly find πŸ™‚
Some of my favorite resources available online are Multimedia, design tools, applications and of course, the awesome HTML and CSS generators! I can’t be thankful enough to the lovely folks who take the time and energy in creating these tools for free….’coz at the end of the day we’re all benefiting from ever increasingly easy-to-use…less time consuming ways to work, play and therefore give us the breathing space to focus on what’s really important, expressing our creative selves. πŸ˜€

HTML Table Style Generator:


Style up an HTML table using CSS with this easy breezy table generator. Select from preset color settings or select your own theme with the controls. Once finished the HTML and CSS will be generated.

Patternify – CSS Pattern Generator:


A Simple pattern generator, that takes the hassle out of opening up Photoshop, creating an image then uploading/attaching to your site. Patternify basically takes away the need to have an image file, you create your custom pattern which then generates the code to place on your site.

CSS3 Generator:


CSS3 generator gives you the simple and easy way to create rounded corner, box shadow, background gradients and opacity to implement onto your web design projects. Visually create with the sliders all in one place, once you’re satisfied with what you’ve got, generate the code and place onto your stylesheet.

CSS3 Generator:


Another CSS3 generator, this one gives you a bit more flexibility…aside from the rounded corner, box shadow…etc. You also get text shadow, multiple columns, transitions, @ FontFace, selectors, rgba, box sizing, outline and transform.

CSS 3.0 Maker:


CSS 3.0 Maker is…yes, another CSS3 generator, again giving you much more flexibility creating lovely styles.

CSS Button Generator:


I remember not too long ago, creating buttons on a website required creating images, and sometimes multiple instances of images, which was fine and dandy, except the more image files you’ve got on your site the slower it becomes to load the page. That’s when the button generator comes in handy. Create beautiful buttons without the need of any images….only the goodness of css code.

Ultimate CSS Gradient Generator:


If you use Photoshop, you’ll appreciate this. It generates a Photoshop-like editor all in CSS…no need for images.

CSS3 Gradient Generator:


Here’s another great CSS3 gradient generator.

Border Radius:


This generator has one purpose….to create the perfect border radius styles, pure and simple πŸ™‚

CSS Sandbox:


This CSS Sandbox pretty much generates everything mentioned above, great UI to work with and my favorite part, generates radial gradients, an addition to CSS3.

CSS Warp – CSS Text to Path Generator:


I personally love this one! Working with Illustrator for over a decade, i was quite impressed to find a CSS text to path generator. Now you don’t need to create rounded or warped text effects using images. Just play around with the curves as you would in Illustrator paths ..and generate it to CSS!

Mother Effing Text Shadow:


This one pretty much speaks for itself. Focuses on creating crazy cool 3D text shadow goodness.

Iconize Text Links with CSS:


Iconize textlinks provides a CSS file that pretty much generates a little icon next to a link, which identifies what “type” of link is attached on your website.

Mr. Data Converter:


This one is pretty neat…if you work with a lot of data, it will convert an Excel sheet into HTML, JSON, XML and other web-friendly formats.

Crunchie Corner Lab:


The Crunchie Corner Lab is a simple tool allowing you to see how a variety of different borders, colors, shadows and radius values affect the display of your fancy CSS3 rounded corners.

LS – LayerStyles:


LayerStyles is another Photoshop-like tool that generates custom CSS, in the same way you would add styles to a Photoshop layer.

Nice and Free CSS Templates:


This one comes in quite handy when you’re creating a website. You’ve got 12 different template layout styles to choose from, all provide a preview and the basic CSS you can work and expand from.

ProCSSor – Advanced CSS Prettifier:


ProCSSor in an advanced tool that prettifies the appearance of your CSS the way you want. An excellent way to turn you CSS into a visually appealing structure and no effort on your part, just copy, paste, attach…and procss away!

Boxtuffs – The Box of free PSD Stuff and HTML5/CSS3 things:


Boxtuffs is a fabulous site proving free PSD, HTML5 and CSS3 goodness!

MochiKit – A Lightweight Javascript Library:


“MochiKit makes JavaScript suck less” – it’s a suite of JavaScript libraries that help get your work done faster and adapt to pretty much anything you place into it…a one stop shop for JavaScript goodness.

QuirkTools:


QuirkTools provides online tools for creative people.

For more Free Creative Design and Multimedia tools…check out:


10 Fantastic Creative Multi-Media & Video Applications

Ever wanted to be the headlining star in your very own show?

The tools listed below all give you the ability to not only star in, but create, edit, publish, and share your very own artistic video making awesomeness. The fun doesn’t end there, from creating your own slide shows, to your very own karaoke videos, to niche market videos for all of your multi-purpose uses from your business to your creative endeavors.

You think that’s great…..not only can you do all of the above, but you can do it for free!

1. FlixTime – Video Slideshows Made Easy

FlixTime

2. EmbedPlus – Real time reactions

EmbedPlus

3. CaptionTube – Be Seen heard, & Read

CaptionTube

4. JayCut – Your Free Online Video Editor

JayCut

5. Pixorial – Video Sharing Service

Pixorial

6. SlideBomb – Ultimate Mashup Slideshow

SlideBomb

7. Stupeflix Studio – Video Production Made Easy

Stupeflix Studio

8. TunePrompter – Create Your Own Karaoke Videos

Tuneprompter

9. VP Factory – Online Video Platform

VP Factory

10. vReVeal – Fix your shaky videos, for free

vReveal

Divine: PSD to WordPress

Divine

BEing a graphic/web designer, I’ve been on a new path of creating WordPress theme designs…my only set back was, 1. either find a great wp-theme developer or 2. learn the whole wp structure and do it myself.

Well…HELLO to the new release of Divine. This awesome application “creates websites from Photoshop to WordPress promptlyΒ  and it’s Free!!” Ok so, i’m a little excited, however i haven’t tested it yet, the latest release works on a PC platform…and i’m on a Mac πŸ™
The good news is that they are going to be releasing the Mac version (yay…and muchly appreciated). Going through the documentation, there are some limitations to the free beta version, so i’m not exactly sure if they will be releasing a full version for free or paid. Alas I’m excited, needless to say, and look forward to the Mac release…and heck if I’d have to pay for the full version…i think i just might πŸ™‚

[Video] Web Trend Map 4

In a previous post of introducing the Web Trend Map, the creators, iA are in the works of something quite amazing! They’ve been busy building an interactive version of the Web Trend Map under webtrendmap.com. The idea is simple: Track the online tends in real time, deliver them in personalized and localized isometric maps. Launch date of the revolutionary little online app is the storm date of the Bastille: July 14th.Β  Just Check out this video!

Manage Your Installed Applications with HimmelBar

HimmelBar provides an icon in the menu bar to quickly access your installed applications located under standard locations such as local, user, network and developer applications.Β  Allows for some breathing space on your Dock πŸ™‚

HimmelBar