blogfreakz.com » Color Picker

6 Useful CSS Color Tools

Marvin@Blogfreakz — Tue, 24 Jan 2012 02:57:11 +0000

If you wish to design your WordPress blog’s appearance by yourself, you can rely on CSS. Here are 6 useful CSS color tools that could help get you started.

Color Scheme Designer

Color Scheme Designer provides colors in color wheel form. It has different color variations in percentage ratio like mono, tetrad, triad, analogic, accented analogic and complementary. This is especially useful in creating color combinations that work.

Ultimate CSS Gradient Generator

This gradient editor and generator tool allows you to make CSS gradients with cross-browser support. It has a Photoshop-like interface, opacity support with opacity stops, import from image and existing CSS, flexible preview panel, over 135 gradient presets and more!

CSS ColorCodes

With this tool, you can select any color from the color picker then copy its hexadecimal value from the bottom field. It also has 2 options which you can provide the RGB and hexadecimal color codes.

Colors Palette Generator

Colors Palette Generator allows you to upload any image you want for generating and using a color palette based on the image’s primary colors.

CSS Colors

This tool offers over 16 million colors with both RGB and hexadecimal color modes.

Gradient Image Maker

Gradient Image Maker creates gradient images that you can use in your website’s template design. It lets you generate 3 types of gradient images with instant previewing.

Incoming search terms for the article:

Excellent HSL Color Picker

Mufti Ali — Fri, 04 Mar 2011 14:43:27 +0000

HSL Color Picker is web based HSL color picker created by Brandon Mathis. HSL (Hue, Saturation, Luminosity) allows us to describe meaningful relationships between colors. Give this brown color, hsl(36, 73%, 10%), it’s clear that if we desaturate 40 steps and lighten 70 steps we get hsl(36, 33%, 80%), a cream color. Look at that in hex, #2C1D07 to #DDCFBB, or in rgb, rgb(44, 29, 7) to rgb(221, 207, 187), and the relationship between colors isn’t evident in any meaningful way.

In graphics software We pick colors in HSB (Hue, Saturation, Brightness) because it feels more natural to work with than RGB or CMYK. Now, with CSS3 we can use HSL which is actually quite different than HSB. Without a decent HSL color picker, it’s difficult to understand.

Requirements: -
Demo: http://hslpicker.com
License: License Free

Incoming search terms for the article:

CSS Gradient Editor – Photoshop-like CSS Gradient Editor

Mufti Ali — Thu, 07 Oct 2010 01:14:18 +0000

Ultimate CSS Gradient Editor is a powerful Photoshop-like CSS gradient editor from ColorZilla The Ultimate CSS Gradient Editor was created by Alex Sirota (iosart). If you like this tool, check out ColorZilla for more advanced tools such as eyedroppers, color pickers, palette editors and website analyzers.

Features

Adjust the gradient stop position by dragging the stop marker
Adjust the stop color by double clicking on the stop marker
Delete a stop by draggin the stop marker up or down
Add a new stop by clicking anywhere in between the existing stop markers

As you might know, HTML5 introduced many exciting features for Web developers. One of the features is the ability to specify gradients using pure CSS3, without having to create any images and use them as repeating backgrounds for gradient effects.

Important: You’ll need a recent version of Firefox, Chrome or Safari to use this Gradient Generator. The resulting CSS gradients are cross-browser – they will work in these browsers and will also fall back to a simpler gradient in Internet Explorer.

Requirements: -
Demo: http://www.colorzilla.com/gradient-editor
License: Creative Commons Attribution-ShareAlike license.

Incoming search terms for the article:

xcolor – jQuery color plugin

Mufti Ali — Wed, 04 Aug 2010 12:46:49 +0000

The xcolor plugin is an easy-to-use jQuery extension to manipulate colors in all imaginable combinations. This plugin implements an extensiv color parser and a featureful set of color-manipulation methods. There is also an animate() extension to smooth CSS colors. Another useful method isReadable() completes the whole, by allowing you to check if a text is readable on a certain background. The color value can also be passed in different color models: RGB, HSV/HSB, HSL and their adequate alpha extensions.

All simple color methods return per default the color as hex value. To be correct, the hex value is generated by the overridden toString() method. Thus, in general an object is returned, which can be accessed by one of the following methods:

getRGB() – Returns the color as RGB object
getHSV() – Returns the color as HSV object
getInt() – Returns the color as normalized integer value
getFraction() – Returns the color as fractions object, with every value in the interval [0, 1]
getCss() – Returns the color formatted as a string to be passed to a CSS color attribute
getName() – Returns the nearest color name
getHex() – Returns the color as Hex string (default)

Requirements: jQuery framework
Demo: http://www.xarg.org/project/jquery-color-plugin-xcolor/
Download: http://www.xarg.org/2010/07/my-jquery-playground/
License: License free

Incoming search terms for the article:

Light Weight JavaScript ColorPicker

Mufti Ali — Wed, 28 Jul 2010 14:07:36 +0000

This colorPicker is a light weight all-rounder (only ~46k incl. all 16 files) that can display and let you choose the entire color palette (~16.78 mil. colors) in 6 different color modes (+3 extra modes in RGB). This highly customizable and easy to install app comes in 4 different sizes (from 151 x 87 pixels to 405 x 302 pixels) and therefore different feature levels so you can use it for every supposable cause from ‘easy choice’ to ‘professional determination’.

You’ll also find a lot of extra helpers and smart features like contrast-meter, color-difference-meter, value-slider in input fields, web-smart and web-save button, color memories and much more.

Requirements:-
Demo:http://dematte.at/colorPicker/#demo
License:-