jPalette is a JavaScript/DOM 14-shade, 12-hue palette (plus 12 shades of gray) including RGB primary, secondary and tertiary colors. Limited to 180 colors, which might just be good enough for your project.
Each swatch's rel attribute stores the HTML hexadecimal color code for that particular swatch so you can fish it out, for instance, on a click event (or just grab the background-color property).
While there are other more fully-featured color pickers out there (like EYECON's impressive ColorPicker), jPalette is ultra-lightweight and simple to install. Just include the jpalette js file in your HTML header, create a div with an id of palette, set its total width in your CSS, and you're off!
Note: Double-click anything for HTML element, id and class.
1. Change the color of anything on the page.
This is so old school. Changing the background color of the page was one of the first DHTML effects that wowed me. I was totally amazed.
Let's churn up some nostalgia and change the color of anything on this page. Just type in an HTML element, an ID or a class (e.g. #someId or .someClass) or double click any element you want to change. Try body, p, input, .active or #main. Best not to try div. Play and have fun.
1. First tell me what element, id or class you want to change:
2. What dimension do you want to change?
3. Now click on a color over on the palette. Prepare to be amazed!
4. Feel all old school. Remember the days of table-based layouts. Radical! This is just a demo of what sorts of ridiculousness you can achieve with jPalette. A more practical example might be to have your user flag messages in your app from a certain user with a given color, etc.