Labs : Mouse Paint : Media Upstream

Brush

Brush Size

+

-

Opacity 1.0 ?Control how transparent or opaque your brush will be

+

-

Brush Shapes ? You can paint with a square, circle or both by checking them. If you check 'Text' you'll be able to paint with random letters

Text

Brush Text : Characters ? When Text brush is selected these characters will be used at random. If this is left empty it will use all characters

Colors

Brush Colors ? Your brush will randomly choose between these 10 Colors. You can toggle them on/off and change each color individually by clicking on the colors block.

All ?Toggle all the colors on or off at once, or choose random colors

off

random colors

Background Color

Effects

Shadow ? Sets a drop shadow on each object. Acceleration ? the faster you move your mouse, the larger in size it will be. Eclipse ? The Shadow colors are set to the brush color and the brush is painted the same as the background color. Ghost ? Makes your brush hollow, only the border will be drawn. Sine ?As you draw your brush will grow and shrink like a sine wave

Zoom? Grow or Shrink the size of each visible object.. this can become unresponsive if you have a lot of objects on the screen!

Tip: set your brush opacity to around 0.1 and draw a few objects then zoom them up a few times!

-

+

Close

Painting with jQuery

Updated: 1/18/2010

Painting with jQuery utilizes jQuery and CSS3 to create an experimental browser based painting program. All of the effects such as shadows, opacity and colors are created by manipulating the CSS styles of DOM objects.

Tested in - Safari, Firefox 3. Chrome. Runs best in Safari