Below is a screenshot of how you get to create your CSS menu. In the top row, you can see the live preview. We chose this one to demonstrate how it works. All you have to do is tell the free generator how many buttons you want, and then enter the labels (titles) with the according links.

What you get is a complete, ready-to-use CSS menu template with hover effects. The images are included in the download. If you use CSS in web design (which you absolutely shoud), you’ll love this little tool.

Check the free online CSS Menu Maker out right here!

You can choose your favorite web badge style out of a variety of pre-made designs. Then you enter your text, using the fonts you prefer, pick the badge color and that of the text, et voilà, you’re done! Fast and easy with no hassle at all – and no Photoshop or Illustrator involved.

The web badge generator looks like this:

…and you can jump to it right here. Have fun!

Update: Also check out this free vector art pack with one poppy Web Badge after another.

Before you start creating the corner images and writing the CSS styles to position them yourself, try this great tool out. It gives you all of the above – the corner images for free download, the CSS code to copy & paste, Internet Explorer conditional HTML tags and even the HTML code itself. All you have to do is insert your content and you’re ready to go.

The generator is called Spanky Corners and is on sitepoint.com. We dig this pure online tool very much!

The site describes their free service like this:

‘Spanky Corners’ is an experimental technique for using only CSS to produce ’round-cornered content boxes’ with semantically pure markup. It does not require JavaScript to work.

Now this is what we call fun! Look at how easy they make it for you: this is all you have to do:

… to get this:

• the GIF images in your specified colors,
• the complete CSS code for the DIV,
• the HTML code for the DIV,
• the Internet Explorer only CSS file,
• the IE conditional comment for your HTML source to call that CSS.

Spanky, eh? Go to this wonderful css generator right here.

This free online generator is a great, easy tool for rasterizing images quickly – without using Photoshop or Illustrator. Adobe Photoshop has a similar effect, and more options for sure (not to speak of plugins for rasterizing images), but this cool website does it all in a few easy steps and generates a PDF for you to download in less than a minute!

After uploading a picture or specifying an image URL, you can crop the image, resize it, and choose the rasterization method. Do you prefer small black dots or larger, colored dots? It’s all in your hands!

Remember, this free, web-based tool doesn’t replace any tools you might have, or even Photoshop. Instead, it’s a quick and easy way of rasterizing images without a lot of work. The results, while not the most optimal, are quite good indeed.

This is what your raster image result could look like:

You can jump to the Rasterbator here. Have fun rasterizing!

This is a wonderful web-based and free tool for every web developer!

The website Typetester lets you compare up to three different typefaces on your screen. You simply choose from a large list of predefined fonts and define the parameters. Almost instantly, you can see the results on your screen – as well as every available font style.

Typetester not only supports every web-safe font, but also default Windows and Apple fonts. In addition to that, you can choose from a long list of specific fonts, including pixel fonts.

Once you’ve finished setting up your preferred font, you can get the CSS source code for that setting, ready for you to copy&paste to your CSS script. But be sure to check it before applying it to your website, as there are still some minor bugs in the code.

Also, if you pick a font which is not compatibe with internet standards, like, for instance, a pixel font (e.g. ‘hooge’, like in the screenshot above), you must be aware of the fact that whoever views your website and does not have that specific typeface installed will see the text on your website in a standard font such as Times New Roman. That’s the crux with web safe fonts

You can jump to Typetester right here.

Did you notice our new, cute little button at the bottom of Beeex.net? It’s right under the Firefox 2 Badge and it says “We love Beeex”. Do you know how we made it? Here goes:

You might already have come across these buttons or badges while surfing the web. They are usually used for displaying meta and stats content. Now, you can easily make your own – using this free online button generator!

Of course, you could use Adobe Illustrator or Photoshop, or another graphic program to design your own button. But this is a quick and easy way to generate them in just a minute. You simply fill in your preferred text, define border and background colors, and the button generator creates a badge for you to download and use on your site.

You can go to the Online Button/Badge Generator here.

This is a goodie! If you run a website and you want a certain page to be password protected, this is what you need. Sometimes, you just don’t want to go through a CGI Script. So here comes the easier JavaScript solution!

This is an encrpyted password protection generator, fully web-based and free. It gives you JavaScript code to copy&paste into your HTML source code.

This is how it works: name a password of your choice, hit ‘Generate’, and the JavaScript code is being generated. You get code to copy&paste into your HTML file.

Using this script, you have to have a starting page to call the form (where the user has to input the password). Only if the correct password has been entered, the target HTML page opens. Plus: the JavaScript code is encrypted, so nobody can see the password by opening the HTML source.

You can go to the generator here.

If you run a website, you’re gonna love this one: it’s a fully web-based Favicon generator. Trust us: even if you think you already know the best way to create Favicons (like Microangelo), you absolutely need to take a look at this one. The benefit: You don’t need to buy and install software, and you get a very high quality Favicon in an instant!

Making a sophisticated Favicon has never been easier. You simply upload an image of your choice (PNG, GIF or JPEG) – that can be up to 5 MB -, then you crop it by dragging and resizing a rectangle over your image, hit ‘Capture & Preview’ – and you’re done!

You can then download the .ico file to place it in your own website’s root as a favicon. The site even offers you the HTML tag to copy&paste to your source code. And the best part is: it’s fully, totally, absolutely free. Thanks to the guys at A Beautiful Site for this!

You can jump to favikon here.

If you don’t know how to install a Favicon on your website, you’ll want to read this post.