Color Selector

HTML 5 Elements

HTML 5 Template

HTML X11 Color Names

XML and HTML Characters

Resources

Html

HTML X11 Color Names

The list of web “X11 colors” from the CSS3 specification, along with their hexadecimal and decimal equivalents, is shown below, compare the alphabetical lists in the W3C standards. Note that this includes the common synonyms: aqua (HTML4/CSS 1.0 standard name) and cyan (common sRGB name), magenta (common sRGB name) and fuchsia (HTML4/CSS 1.0 standard name), gray (HTML4/CSS 1.0 standard name) and grey. table.colornames{float:left;table-layout:fixed;width:300px;background:transparent;} table.colornames th{text-align:left;font-size:11px;padding:2px;background:transparent;} table.colornames td{color:inherit;font-size:11px;padding:2px} table.colornames tt{font-size:11px;} table.
Html

HTML 5 Template

Template with html5.js shiv * <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>My Super Site!</title> <meta name="description" content="My Super Site!"> <meta name="author" content="My Name"> <link rel="stylesheet" href="css/styles.css"> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> </body> </html> * Inspired by HTML5 Boilerplate Emmet If the Emmet plugin is installed in your code editor, you can use the ! alias or html:5 abbreviation then tab to stub out the template.
Html

HTML 5 - Elements

anchor The anchor element is nothing new. It is a tag that can be either the origin or the target (destination) of a hyperlink. However, in HTML 5 the name attribute has been removed, use an id attribute instead. W3C <a id="content">Content</a> article The article element is a new element to define an independent item of content. W3C MDN <article>Article content ...</article> aside The aside element is a new element to define an independent item of content that is to to one side; out of the way.
Html

XML and HTML Characters

` ` ` ` ` ` CHARACTER TABULATION ` ` ` ` ` ` LINE FEED (LF) ! `!` `!` `!` EXCLAMATION MARK " `" "` `"` `"` QUOTATION MARK # `#` `#` `#` NUMBER SIGN $ `$` `$` `$` DOLLAR SIGN % `%` `%` `%` PERCENT SIGN & `& &` `&` `&` AMPERSAND ' `'` `'` `'` APOSTROPHE ( `(` `(` `(` LEFT PARENTHESIS ) `)` `)` `)` RIGHT PARENTHESIS * `* *` `*` `*` ASTERISK + `+` `+` `+` PLUS SIGN , `,` `,` `,` COMMA .
Html

HTML - Color Selector

Click on any color in the the spectrum to display it’s HTML hex color code in a swatch and the HSL Color Picker underneath. #colortable {min-width:460px;} #colortable td {height:20px;} #selectedcolors {list-style-type:none;margin-left:0;} #selectedcolors li {float:left;display:inline;width:60px;margin-right:5px;font-size:80%;} #selectedcolors span {display:block;width:60px;height:40px;} HSL Color Picker Saturation: Luminance: Hexadecimal: RGB: HSL: Resources YUI - Example: HSL Color Picker YUI - Example: HSL Harmony Color Hex Color Codes var $j = jQuery.noConflict(); $j(function () { $j(‘#colortable’).