Online generators can be extremely handy for creating small details or saving time writing code. Whether it’s a striped background, a pattern or an advanced CSS3 text effect, online generators can surely make your workflow go smoother. This post presents 45 of the best and latest online generators for designers and developers. The emphasis has been put on CSS3 generators since CSS3 is quickly becoming the new progressive web standard.
Backgrounds & Patterns
1. BGMaker
BGMaker allows you to create solid line patterns which are then exported as transparent PNGs. Don’t be fooled, however. If you checked out the gallery, you’d see the true power of this lite generator.
2. BGPatterns
BgPatterns is a tiny web app for making background patterns in a few clicks. It was created mostly for fun and experimentation by Sergii Iavorskyi.
Feedback is welcome.
3. PatternCooler
With PatternCooler you can add your own colors to 100s of cool free pattern designs, or browse from 10 000s of colored patterns using a seamless pattern background editor.
4. TartanMaker
Tartan Maker is a new trendsetting application for cool designers created by Alex ‘Pit’ La Rosa & Fabio Fidanza. You can easily create tartans with up to 10 bands and then export them as PNGs.
5. StripeGenerator
With Stripe Generator you can unleash your personal style, experiment and download the tile. You can use it directly in your CSS file or as pattern in Photoshop.
6. StripeMania
Stripemania is a simple and free web tool to create seamless diagonal stripes for your designs. You are able to choose the size of the stripes and the spacing between those. You can even add color gradient effect for all of your stripes.
7. StripedBackgrounds
StripedBackgrounds generates a 5 column striped background with your chosen colors and resolution.
8. Dotter
Dotter allows you to easily create stylish dotted background with either one or two colors.
9. secretGeek’s GradientMaker
This gradient maker by secretGeek allows you to create horizontal or vertical gradient backgrounds with two colors.
10. ColourLovers Seamless Studio
Seamless Studio makes it easy to design a seamless pattern. With simple editing tools you can resize, rotate and add shapes, lines and text to the canvas and it tiles automatically. Save your pattern template and see how the world colors it in.
11. Background Generator
Background Generator provides the ability to edit the background of any website in real-time. It allows you to create fancy web 3.0 backgrounds without getting dirty with Photoshop and other image editing software. The project includes a collection of textures which are combined with custom linear-gradients and colors to create a wide assortment of themes.
12. Patternify
Patternify is an app that lets you create simple pixel patterns and export them either as PNG or as base64 code. The awesome part is that you can embed the base64 code straight in your CSS code! You don’t even need to use an image file anymore.
Color Palettes
1. Kuler
Kuler by Adobe is a web-hosted application for generating color themes that can inspire any project. No matter what you’re creating, with Kuler you can experiment quickly with color variations and browse thousands of themes from the Kuler.
2. Color Palette Generator
With Color Palette Generator you can generate a color palette based on an image. You can upload your own image or choose from other user submitted ones.
3. Color Scheme Designer
Color Scheme Designer allows you to create various color schemes and export them as HTML/CSS, ACO for Photoshop and many more.
4. Copaso
COPASO from ColourLovers is an advanced color palette tool that helps you create the perfect color palette.
5. Pictaculous
Pictaculous helps you to decide which colors suit best with a particular image. Just upload an image and it will generate a color palette from it. You can also download Adobe Swatch File (ACO).
6. Colormunki
Colormunki allows you to generate color palettes from advanced color libraries, images and browse other user palettes.
Buttons
1. RoundedCornr
With RoundedCornr you can generate HTML/CSS code and images for rounded corners. There are four options to choose from.
2. Tabs Generator
Tabs generator allows you to create tab styled buttons online without using any image editing software. Tweak size, colors, corners and more, generate your design, then download and use in your CSS style sheet.
3. Brilliant Button Maker
Brilliant Button Maker is a web interface to create 80×15 buttons. You can also use two images (one on the left and the other on the right side) to decorate the button.
4. Web 2.0 Badges
Web 2.0 Badges is a generator that creates cool web badges. Badges can be used to display a big ‘Beta’ message on your website or emphasize a price or a promotion. No web 2.0 site is complete without one.
5. FreshGenerator
FreshGenerator is a web design tool which can create interesting graphic elements used in many web 2.0 sites. You may use it to create boxes of different styles and colors. In order to make changes to your image later, store the link listed below the image.
6. Favicon
Favicon is a tool that allows you to create favicons either by painting pixels manually or importing an image.
CSS3 Buttons
1. CSS3 Button Generator
With CSS3 Button Generator you can create modern and stylish web buttons that fits today’s web standards.
2. CSS3 Button Maker
CSS3 Button Maker allows you to easily create CSS3 buttons with gradients and shadows. Just adjust the settings until you have a nice looking button, then press the button and it will give you the CSS.
3. CSS3 Button Generator
Generate fancy CSS3 buttons with just few clicks. This generator also provides you with the code for IE styles.
4. CSS Button Generator
CSS Button Generator will create beautiful CSS buttons for you to use on your web pages without the need for any images. When you have styled your button to your liking, simply click on the generated button to get your CSS style code.
5. CSS3 Button Generator
This CSS3 Button Generator is a HTML/CSS/JavaScript/Flash application that generates all of the style properties and speeds up the code writing for CSS3 buttons.
6. CSS Button Generator
With the CSS Button Generator you can instantly make buttons for your website or blog that use your colors, web fonts, and sizes. The CSS button generator uses no images and can say anything you want in any colors or size.
7. CSS3 Button Generator
Easy tool to generate CSS3 buttons with gradients and shadows.
CSS3 Generators
1. CSS3 Generator
CSS3 Generator allows you to play with multiple CSS3 properties to create backgrounds.
2. CSS3 Generator
Simple generator for creating simple single CSS3 properties.
3. CSS3 Please
CSS3, Please! is a Cross-Browser CSS3 rule generator. You can edit the underlined values in this CSS file and when done, copy the whole CSS code.
4. CSS3Warp
CSS3Warp is a proof of concept: create Illustrator like “warped” text (text following an irregular path) with pure CSS and HTML.
5. CSS3 Text Shadow Generator
CSS3 text shadow generator helps you insert beautiful shadow effects to your texts. You can change between different web fonts and explore different shadow effects such as Fire, 3D , acid and more stunning examples.
6. Ultimate CSS Gradient Generator
Ultimate CSS gradient generator is a powerful Photoshop like CSS gradient editor from ColorZilla.
7. CSS3 Gradient Generator
CSS3 Gradient Generator allows you to generate nifty CSS3 gradients with just a few clicks.
8. CSS3 Rounded Corner Generator
CSS3 Rounded Corners Generator generates the necessary CSS3 code to put rounded corners around your content. You can set different radius for the four corners, it is image free.
9. CSS3 Rounded Corner Generator
This generator will help you create the code necessary to use rounded corners (border-radius) on your webpages.
10. Border Radius
Easy tool for creating rounded corners.
11. Border Image Generator
This generator helps you to generate code for border radius properties.
12. CSS3 Multi-columns
Generator for creating multi-column CSS3 layouts.
13. CSS3 Pie
PIE makes Internet Explorer 6-8 capable of rendering several of the most useful CSS3 decoration features.
14. CSS3 Sandbox
With CSS3 Sandbox you can explore CSS3 features and properties.
Source
No comments:
Post a Comment