- From: SVG Working Group repository <cam@mcc.id.au>
- Date: Mon, 20 Aug 2012 11:44:21 -0700
- To: public-svg-wg@w3.org
details: https://svgwg.org/hg/svg2/rev/2d7ac3e5d383
branches:
changeset: 323:2d7ac3e5d383
user: Chris Lilley <chris@w3.org>
date: Mon Aug 20 20:44:03 2012 +0200
description:
merge in content from SVG Color
diffstat:
master/color.html | 754 ++++++++++++++++++++++++++++++++++++----------
master/refs.html | 5 +
master/style/default.css | 13 +-
3 files changed, 603 insertions(+), 169 deletions(-)
diffs (969 lines):
diff --git a/master/color.html b/master/color.html
--- a/master/color.html
+++ b/master/color.html
@@ -59,36 +59,318 @@
<th>Owner:</th>
<td>Chris (no action)</td>
</tr>
</table>
</div>
<h2 id="ColorIntroduction">Introduction</h2>
+
+ <p>This introduction is non-normative</p>
+
+ <p>Several properties used in SVG take a color specification. Also, external media such as images or video
+ contain colors.</p>
-<p class="issue">
- This section should include an overall discussion of color in SVG as well as links to all the places color
- is discussed in the specification: currentColor, SVG colors, etc.
-</p>
-
-<p>All SVG colors are specified in the sRGB color space
-[<a href="refs.html#ref-SRGB">SRGB</a>]. At a minimum, SVG user
-agents shall conform to the color behavior requirements specified in the
-<a href="http://www.w3.org/TR/2011/REC-CSS2-20110607/syndata.html#color-units">color units section</a>
-defined in the CSS 2.1 specification.</p>
+<p>All SVG colors used as property values include a fallback specified in the sRGB color space
+[<a href="refs.html#ref-SRGB">SRGB</a>]. </p>
<p>Additionally, SVG content can specify an alternate color specification
using an ICC profile [<a href="refs.html#ref-ICC42">ICC42</a>]
-as described in <a href="painting.html#SpecifyingPaint">Specifying paint</a>.
-If ICC-based colors are provided and the SVG user agent supports ICC color,
+<!-- check paint chapter for content that should be here, and move it -->.
+If ICC-based colors are provided,
then the ICC-based color takes precedence over the sRGB color specification;
-otherwise, the RGB fallback colors must be used.
-Note that, in this specification, color interpolation occurs in an RGB color space even if an
-ICC-based color specification is provided (see <a>'color-interpolation'</a>).</p>
+otherwise, the sRGB fallback colors will be used.
+Note that, in this specification, by default color interpolation occurs in sRGB color space even if an
+ICC-based color specification is provided, but this can be changed (see <a>'color-interpolation'</a>).</p>
+
+ <div class="ready-for-wider-review">
+ <h2 id="color-managed-images">Color-managed Images</h2>
+
+ <p class="note">
+ New in SVG2.</p>
+
+ <p>Implementations of SVG2 are required to color-manage all images. The embedded profile is used. If there is no embedded profile, sRGB is assumed, for RGB images.</p>
+
+ <p class="issue">Define processing for untagged greyscale and CMYK images. Could be a default profile, or an 'explicitly undefined' with a warning to avoid untagged non-RGB images when authoring.</p>
+
+
+ <div class="requirement" id="assert_taggedImages">
+ <p>
+ If a referenced image contains color profile information, a
+ Color-managed User Agent MUST use that profile to render the image
+ </p>
+ </div>
+
+ <div class="requirement" id="assert_untaggedImages">
+ <p>
+ If a referenced image contains no color profile information, a
+ Color-managed User Agent MUST use the sRGB profile to render the image
+ </p>
+ </div>
+
+
+ <h2 id="Color_syntax">Color syntax</h2>
+
+
+ <h3 id="sRGBcolor">
+ sRGB colors</h3>
+
+ <p class="prop-value"><a href="#color"><color></a></p>
+
+ <p>Example (these all represent the same color):</p>
+ <div class="example">
+ <pre>
+ <circle fill="rgb(205,133,63)"/>
+ <circle fill="peru"/>
+ <circle fill="rgb(80.392%, 52.157%, 24.706%)"/>
+ <circle fill="#CD853F"/>
+ <circle fill="hsl(30, 59%, 53%)"/></pre>
+ </div>
+
+ <p class="note">
+ Includes all syntactic forms supported by SVG 1.1, adds hsl() from [<a href="refs.html#ref-CSS3COLOR">CSS3COLOR</a>].</p>
+ <p class="note">See the CSS Color Module Level 3 specification for the
+ definition of the color type.
+ [<a href="refs.html#ref-CSS3COLOR">CSS3COLOR</a>]</p>
+
+ <div class="requirement" id="assert_base_syntax">
+ <p>All the syntactic forms for an sRGB color, including the full set of color keywords, shall be supported by an SVG2 User Agent.</p>
+ </div>
+
+ <p>The rendering requirements for sRGB colors are more strict than for SVG 1.1 User Agents,
+ where color management is optional.</p>
+ <div class="requirement" id="assert_render_sRGB">
+ <p>
+ When an sRGB color is used - because it is the sole color specification, or in a
+ permitted fallback situation - a conformant SVG2 User Agent
+ shall render it in conformance with the ICC profile for sRGB, to obtain the
+ desired color appearance.
+ </p>
+ </div>
+
+ <p class="issue">
+ Define 'permitted fallback situation' and link to it.
+ </p>
+
+ <h3 id="sRGBcoloralpha">
+ sRGB colors with alpha</h3>
+
+ <p class="prop-value"><a href="#color">rgba(r, g, b, a)</a></p>
+
+ <p>Example </p>
+ <div class="example">
+ <pre>
+ <circle fill="rgba(205,133,63, 0.5)"/></pre>
+ </div>
+
+
+ <p class="note">
+ New in SVG2, added from [<a href="refs.html#ref-CSS3COLOR">CSS3COLOR</a>].</p>
+
+ <div class="requirement" id="assert_combine-alpha">
+ <p>When an sRGB color with alpha is used in a property value, an SVG2 User Agent shall combine the alpha value with any separately specified alpha value that applies to that property, by multiplying the alpha values together.</p>
+ </div>
+
+ <p>Example (these render as the same color)</p>
+ <div class="example">
+ <pre>
+ <circle fill="rgba(205,133,63, 0.25)"/>
+ <circle fill="rgba(205,133,63, 1.0)" fill-opacity="0.25"/>
+ <circle fill="rgba(205,133,63, 0.5)" fill-opacity="0.5"/></pre>
+</div>
+
+
+ <div class="requirement" id="assert_render_sRGB">
+ <p>
+ When an sRGB color with alpha is used - because it is the sole color specification, or in a
+ permitted fallback situation - a conformant SVG2 User Agent
+ shall render it in conformance with the ICC profile for sRGB, to obtain the
+ desired color appearance.
+ </p>
+ </div>
+
+ <h3 id="icc-colors">
+ ICC colors</h3>
+
+ <p class="prop-value"><a href="#fallback"><fallback></a>
+ <a href="#icccolor"> icc-color(<name> [,<icccolorvalue>]*) </a></p>
+
+ <p>Example:</p>
+ <div class="example">
+ <pre>
+ <style>@color-profile {
+ name="acmecmyk"
+ src="http://printers.example.com/acmecorp/model1234"}
+ </style>
+ <circle fill="#CD853F icc-color(acmecmyk, 0.11, 0.48, 0.83, 0.00)"/></pre>
+ </div>
+
+ <p>Example:</p>
+ <div class="example">
+ <pre>
+ <color-profile name="acmecmyk" href="http://printers.example.com/acmecorp/model1234"/>
+ <circle fill="#CD853F icc-color(acmecmyk, 0.11, 0.48, 0.83, 0.00)"/></pre>
+ </div>
+
+ <p class="note">Same syntax as SVG 1.1, increased conformance requirement.</p>
+
+ <p>SVG2 uses the extended ICC color specification from SVG 1.1. In SVG 1.1, parsing the syntax was required but implementing the ICC colour itself was optional, as indicated by phrases such as "If ICC-based colors are provided and the SVG user agent supports ICC color, then...". An SVG 1.1 user agent which also conforms to this specification "supports ICC color" for the purposes of conforming to SVG 1.1.</p>
+
+ <p>
+ As with SVG Full 1.1, SVG Color content may specify color using an ICC profile (see
+ [<a href="#ref-ICC42">ICC42</a>]); an sRGB fallback must still be provided.
+ </p>
+
+ <p>An SVG2 User Agent searches the color profile description database for
+ a <a href="#ColorProfileDescriptions">color profile description</a> entry whose
+ name descriptor matches <name> and uses the last matching entry that is found;
+ painting shall be done using the given ICC color, where the comma-separated list
+ (with optional white space) of <strong><icccolorvalue></strong>'s is a set
+ of ICC-profile-specific color values, expressed as <a href="http://www.w3.org/TR/SVGMobile12/types.html#DataTypeNumber">
+ <number></a>s (see <a href="#icc-colors">ICC colors</a>). If no match is
+ found, then the fallback sRGB color is used.
+ </p>
+
+ <div class="requirement" id="assert_ICCColorPrecedence">
+ <p>
+ If ICC-based colors are provided, an SVG2 User Agent
+ MUST use the the ICC-based color in preference to the sRGB fallback color,
+ unless the ICC color profile cannot be used (is unavailable, malformed, or uses an unsupported profile connection
+ space).</p>
+ </div>
+ <div class="requirement" id="assert_useICC">
+ <p>When rendering, if both ICC and sRGB fallback colors are provided and the referenced ICC profile can be used, a Color-managed User Agent MUST render using the ICC color values, using the specified ICC profile as the input profile.</p>
+ </div>
+
+ <h3 id="LAB">LAB color</h3>
+
+ <p class="note">
+ New in SVG2.</p>
+
+ <p class="prop-value"><a href="#fallback"><fallback></a>
+ <a href="#cielabcolor">cielab(<Lightness>, <a> <b>)</a> | <br />
+ <a href="#fallback"><fallback></a>
+ <a href="#cielchabcolor">cielchab(<Lightness> <Chroma>, <Hue> )</a>
+ </p>
+
+<div class="example">
+ <pre>
+ <circle fill="#CD853F cielab(62.253188, 23.950124, 48.410653)"/>
+ <circle fill="#CD853F cielch(62.253188, 54.011108, 63.677091)"/>
+</pre>
+ </div>
+
+
+ <p>An SVG2User Agent directly uses the CIE LAB or CIE LCHab values, where the comma-separated list
+ (with optional white space) of <strong><icccolorvalue></strong>'s is a set
+ of Lightness, a and b or Lightness, Hue and Chroma values, expressed as <a href="http://www.w3.org/TR/SVGMobile12/types.html#DataTypeNumber">
+ <number></a>s. A color profile is not referenced in the SVG, although profile-based implementations may
+ choose to implement this by providing and using an LAB profile.</p>
+
+ <p>The white point is D50, which is the whitepoint defined by the CIE for CIELab profile connection space and the
+ whitepoint used for image editors that provide LAB functionality.
+ LAB measurements relative to a different whitepoint should be adapted to D50 to be used in SVG2; the linear Bradford chromatic adaptation transform [<a href="refs.html#ref-Bradford">BRADFORD</a>] is suggested for this.</p>
+
+ <div class="requirement" id="assert_LABColorPrecedence">
+ <p>
+ If LAB-based colors are provided, an SVG2 User Agent
+ MUST use the the LAB-based color in preference to the sRGB fallback color.</p>
+ </div>
+ <div class="requirement" id="assert_useLAB">
+ <p>When rendering, if both LAB and sRGB fallback colors are provided, a Color-managed User Agent MUST render using the ICC color values, using the specified ICC profile as the input profile.</p>
+ </div>
+
+ <p>A fallback sRGB color must still be provided, for non-colormanaged user agents.</p>
+
+ <h3 id="named">
+ ICC named color</h3>
+
+ <p class="note">
+ New in SVG2.</p>
+
+
+ <p class="prop-value"><a href="#fallback"><fallback></a>
+ <a href="#iccnamedcolor">icc-named-color(<name>, <namedColor>)</a></p>
+
+ <p>Example:</p>
+ <div class="example">
+ <pre >
+ <color-profile name="FooColors" href="http://swatches.example.com/Foo"/>
+ <circle fill="#CD853F icc-color(FooColors, Sandy23C"/></pre>
+ </div>
+
+ <p>
+ SVG Color introduces the ability to specify a color using a 'Named Color Profile'.
+ </p>
+ <p>An SVG2 User Agent searches the color profile description database for
+ a <a href="#ColorProfileDescriptions">color profile description</a> entry whose
+ name descriptor matches <name> and uses the last matching entry that is found;
+ painting shall be done using the given ICC color, where namedColor is a <a href="http://www.w3.org/TR/SVGMobile12/types.html#DataTypeString">
+ <string></a> indicating the named color to use.</p>
+
+ <p>ICC named color profiles provide a platform- and implementation-neutral way
+ to share a swatch of colors, or to use user-created names for colors.</p>
+
+ <div class="requirement" id="assert_ICCNamedColorPrecedence">
+ <p>
+ If ICC-based named colors are provided, a conformant SVG2 User Agent
+ MUST use the the ICC-based named color in preference to the sRGB fallback
+ color, unless the ICC named color profile is unavailable, malformed, or uses a profile
+ connection space other than CIE XYZ or CIE LAB.</p>
+ </div>
+ <div class="requirement" id="assert_useICCNamed">
+ <p>
+ When an ICC named color is used, a conformant Color-managed User Agent
+ shall render it in conformance with the specified ICC profile to obtain the
+ desired color appearance.</p>
+ </div>
+
+ </div>
+
+<div class="ready-for-wider-review">
+ <h2 id="Unmanaged">Unmanaged colors</h2>
+ <h3 id="#device">
+ Uncalibrated device color</h3>
+
+ <p class="note">
+ New in SVG2.</p>
+
+ <p class="prop-value"><a href="#fallback"><fallback></a>
+ <a href="#devicegray">device-gray(<gray>) </a> | <br />
+ <a href="#fallback"><fallback></a>
+ <a href="#devicergb">device-rgb(<red> <green> <blue>) </a> | <br />
+ <a href="#fallback"><fallback></a>
+ <a href="#devicecmyk">device-cmyk(<cyan> <magenta> <yellow>
+ <black>) </a> | <br />
+ <a href="#fallback"><fallback></a>
+ <a href="#devicegray">device-nchannel(<number>+) </a> |
+ </p>
+
+
+ <div class="example">
+ <pre>
+ <circle fill="#CD853F device-cmyk(0.11, 0.48, 0.83, 0.00)"/></pre>
+ </div>
+
+ <p>
+ SVG2 introduces a method of specifying uncalibrated device colors. This
+ is sometimes useful in print workflows, for example to produce patches of known
+ ink density used for quality control purposes. </p>
+
+ <p>An SVG2 User Agent which supports the indicated class of output device
+ will pass the values through without color management. If the class of output device
+ (for example, cmyk) is not supported, then the fallback
+ sRGB color is used.
+ </p>
+ <p>
+ As these are uncalibrated, any interpolation or compositing occurs using the fallback
+ sRGB color value.</p>
+
+</div>
<div class="ready-for-wider-review">
<h2 id="ColorProperty">The effect of the <span class="property">'color'</span> property</h2>
<p class="note">See the CSS Color Module Level 3 specification for the
definition of <a>'color'</a>.
[<a href="refs.html#ref-CSS3COLOR">CSS3COLOR</a>]</p>
@@ -133,49 +415,42 @@ svg { border: 1px solid #888; background
<p class="caption">The text and arrow in the SVG fragment are filled
with the same color as the inherited <a>'color'</a> property.</p>
</div>
</div>
</div>
<h2 id="ColorProfileDescriptions">Color profile descriptions</h2>
-<h3 id="ColorProfileDescriptionsOverview">Overview of color profile descriptions</h3>
-
-<p>The <a href="http://www.color.org/">International Color
-Consortium</a> has established a standard, the ICC Profile
-[<a href="refs.html#ref-ICC42">ICC42</a>], for
-documenting the color characteristics of input and output
-devices. Using these profiles, it is possible to build a
-transform and correct visual data for viewing on different
-devices.</p>
-
-<p>A <dfn id='color-profile-description'>color profile description</dfn>
-provides the bridge between an ICC profile and references to
-that ICC profile within SVG content. The color profile
-description is added to the user agent's list of known color
-profiles and then used to select the relevant profile. The
-color profile description contains descriptors for the location
-of the color profile on the Web, a name to reference the
-profile and information about rendering intent.</p>
+ <h3 id="ColorProfileDescriptionsOverview">
+ Overview of color profile descriptions</h3>
+ <p>
+ The <a href="http://www.color.org/">International Color Consortium</a> has established
+ a standard, the ICC Profile [<a href="http://www.color.org/ICC-1A_1999-04.PDF">ICC32</a>],
+ for documenting the color characteristics of input and output devices. Using these
+ profiles, it is possible to build a transform and correct visual data for viewing
+ on different devices.</p>
+ <p>
+ A <span class="SVG-Term">color profile description</span> provides the bridge between
+ an ICC profile and references to that ICC profile within SVG content. The color
+ profile description is added to the user agent's list of known color profiles and
+ then used to select the relevant profile. The color profile description contains
+ descriptors for the location of the color profile on the Web, a name to reference
+ the profile and information about rendering intent.</p>
<h3 id="ColorProfileAlternatives">Alternative ways of defining a color profile description</h3>
<p>Color profile descriptions can be specified in either of the following ways:</p>
<ul>
<li>a <a>'color-profile element'</a> element</li>
- <li>an <em>@color-profile</em> rule within a CSS style sheet (only
- applicable for user agents which support using CSS to style the SVG
- content</li>
+ <li>an <em>@color-profile</em> rule within a CSS style sheet </li>
</ul>
-<p class="issue">The above used to reference CSS2. @color-profile was
-removed from the latest draft of css3-color, too.</p>
<p>If a color profile with the same <em>name</em> value has
been identified by both a <a>'color-profile element'</a> element and
<em>@color-profile</em> rules within a CSS style sheet, then
the user agent shall first attempt to locate the profile by
using the specifications in the <em>@color-profile</em> rules
first.</p>
@@ -183,61 +458,61 @@ first.</p>
<edit:with element='color-profile'>
<edit:elementsummary name='color-profile'/>
<div class="adef-list">
<p><em>Attribute definitions:</em></p>
<dl>
- <dt id="ColorProfileElementHrefAttribute"><span class="adef">xlink:href</span> = "<span
+ <dt id="ColorProfileElementHrefAttribute"><span class="adef">href</span> = "<span
class="attr-value"><a
href="types.html#DataTypeIRI"><iri></a></span>"</dt>
<dd>The location of an ICC profile resource.<br />
<span class="anim-target"><a
href="animate.html#Animatable">Animatable</a>:
- no.</span></dd>
- <dt id="ColorProfileElementLocalAttribute"><span class="adef">local</span> = "<span
+ no.</span>
+
+ <dt id="ColorProfileElementLocalAttribute"><span class="adef">local</span> = sRGB | "<span
class="attr-value"><string></span>"</dt>
<dd>The unique ID for a locally stored color profile.
<string> is the profile's unique ID as specified by
<a href="http://www.color.org/">International Color
- Consortium</a>. If both the <a>'xlink:href'</a> and the <a>'local'</a>
- attributes are specified,
- then the user agent shall search the local system for the
- locally stored color profile first, and, if not available
- locally, then attempt to use the resource identified by the
- <a>'xlink:href'</a> attribute. (Note:
- Profile description fields do <em>not</em> represent a
- profile's unique ID. With current ICC proposals, the
- profile's unique ID is an MD5-encoded value within the
- profile header.)<br />
+ Consortium</a>.
+ <div class="requirement" id="assert_sRGBCaseInsensitive">
+ When used in a style sheet,
+ for consistency with <a href="http://www.w3.org/TR/CSS2/grammar.html">CSS lexical
+ scanning and parsing rules</a>, the keyword "sRGB" MUST be case-insensitive. However,
+ it is recommended that the mixed capitalization "sRGB" SHOULD be used for consistency
+ with common industry practice.</div>
+ </dd>
+ <div class="requirement" id="assert_localColorProfilesFirst">
+ If both the <a href="#ColorProfileElementHrefAttribute"><span class="attr-name">href</span></a>
+ and the <span class="attr-name">local</span> attributes are specified, then the
+ user agent MUST search the local system for the locally stored color profile first,
+ and, if not available locally, then attempt to use the resource identified by the
+ <a href="#ColorProfileElementHrefAttribute"><span class="attr-name">href</span></a>
+ attribute.</div>
+ (Note: Profile description fields do <em>not</em> represent a profile's unique ID.
+ With current ICC proposals, the profile's unique ID is an MD5-encoded value within
+ the profile header.).<br />
<span class="anim-target"><a
href="animate.html#Animatable">Animatable</a>:
no.</span></dd>
<dt id="ColorProfileElementNameAttribute"><span class="adef">name</span> = "<span
class="attr-value"><identifier></span>"</dt>
<dd>The name which is used as the first parameter for <span
class="prop-value">icc-color</span> specifications within
<a>'fill'</a>, <a>'stroke'</a>, <a>'stop-color'</a>,
<a>'flood-color'</a> and <a>'lighting-color'</a> property
values to identify the color profile to use for the ICC
color specification and the name which can be the value of
the <a>'color-profile element'</a> property. Note
that if 'name' is not provided, it will be impossible
- to reference the given color profile description. The name
- "sRGB" is predefined; any color profile descriptions with
- <span class="attr-value"><identifier></span> set to "sRGB"
- will be ignored. For consistency with <a
- href="http://www.w3.org/TR/2011/REC-CSS2-20110607/grammar.html#scanner">CSS
- lexical scanning and parsing rules</a>
- ([<a href="refs.html#ref-CSS21">CSS21</a>], section G.2), the keyword "sRGB"
- is case-insensitive; however, it is recommended that the
- mixed capitalization "sRGB" be used for consistency with
- common industry practice.<br />
+ to reference the given color profile description.
<span class="anim-target"><a
href="animate.html#Animatable">Animatable</a>:
no.</span></dd>
<dt id="ColorProfileElementRenderingIntentAttribute"><span class="adef">rendering-intent</span> = "<span
class="attr-value">auto | perceptual |
relative-colorimetric | saturation |
absolute-colorimetric</span>"</dt>
<dd>
@@ -247,57 +522,111 @@ first.</p>
primarily to color profiles corresponding to CMYK color
spaces. The different options cause different methods to
be used for translating colors to the color gamut of the
target rendering device:</p>
<dl>
<dt><span class='prop-value'>auto</span></dt>
<dd>This is the default behavior. The user agent
determines the best intent based on the content type.
- For image content containing an embedded profile, it
- shall be assumed that the intent specified within the
- profile is the desired intent. Otherwise, the user
- agent shall use the current profile and force the
- intent, overriding any intent that might be stored in
- the profile itself.</dd>
+ <div class="requirement" id="assert_renderingIntentAuto">
+ For image content containing an embedded profile, the User Agent MUST use the intent
+ specified within the profile. Otherwise, the user agent MUST use the current profile
+ and force the intent, overriding any intent that might be stored in the profile
+ itself.
+ </div></dd>
<dt><span class='prop-value'>perceptual</span></dt>
- <dd>This method, often the preferred choice for images,
- preserves the relationship between colors. It attempts
- to maintain relative color values among the pixels as
- they are mapped to the target device gamut. Sometimes
- pixel values that were originally within the target
- device gamut are changed in order to avoid hue shifts
- and discontinuities and to preserve as much as possible
- the overall appearance of the scene.</dd>
+ <dd> <p>This method is often the preferred choice for images, especially when
+ there are substantial differences between the source and destination
+ (such as a CRT display image reproduced on a reflection print). It takes
+ the colors of the source image and re-optimizes the appearance for the
+ destination medium using proprietary methods. This re-optimization may
+ result in colors within both the source and destination gamuts being
+ changed, although perceptual transforms are supposed to maintain the
+ basic artistic intent of the original in the reproduction. They will not
+ attempt to correct errors in the source image.
+ </p>
+ <p class="note">With v2 ICC profiles there is no specified perceptual reference
+ medium, which can cause interoperability problems. When v2 ICC profiles
+ are used it may be safer to use the media-relative colorimetric
+ rendering intent with black point compensation, instead of the perceptual
+ rendering intent, unless the specific source and destination profiles to
+ be used have been checked to ensure the combination produces the desired
+ result.
+ </p>
+ <div class="requirement" id="assert_renderingIntentPerceptual">
+ This method SHOULD maintain relative color values among the pixels as they are mapped
+ to the target device gamut. This method MAY change pixel values that were originally
+ within the target device gamut, in order to avoid hue shifts and discontinuities
+ and to preserve as much as possible the overall appearance of the scene.
+ </div>
+ </dd>
<dt><span class='prop-value'>saturation</span></dt>
- <dd>Preserves the relative saturation (chroma) values
- of the original pixels. Out of gamut colors are
- converted to colors that have the same saturation but
- fall just inside the gamut.</dd>
+ <dd> <p>This option was created to preserve the relative saturation (chroma) of
+ the original, and to keep solid colors pure. However, it experienced
+ interoperability problems like the perceptual intent, and as solid color
+ preservation is not amenable to a reference medium solution using v4
+ profiles does not solve the problem. Use of this rendering intent is <em>not
+ recommended</em> unless the specific source and destination profiles to be
+ used have been checked to ensure the combination produces the desired
+ result.
+ </p>
+ <div class="requirement" id="assert_renderingIntentSaturation">
+ This option SHOULD preserve the relative saturation (chroma) values of the original
+ pixels. Out of gamut colors SHOULD be converted to colors that have the same saturation
+ but fall just inside the gamut.
+ </div></dd>
<dt><span class='prop-value'>relative-colorimetric</span></dt>
- <dd>Leaves colors that fall inside the gamut unchanged.
- This method usually converts out of gamut colors to
- colors that have the same lightness but fall just
- inside the gamut.</dd>
+ <dd> <p>Media-relative colorimetric
+ is required to leave source colors that fall inside the destination
+ medium gamut unchanged relative to the respective media white points.
+ Source colors that are out of the destination medium gamut are mapped to
+ colors on the gamut boundary using a variety of different methods.</p>
+
+ <p>NOTE The media-relative colorimetric rendering intent is often used with
+ black point compensation, where the source medium black point is mapped
+ to the destination medium black point as well.</p>
+
+ <div class="requirement" id="assert_renderingIntentRelativeColorimetric">
+ This method MUST map the source white point to the desination white point.
+ If black point compensation is in use, the source black point MUST also be mapped to the destination black point.
+ Adaptation algorithms SHOULD be used to adjust for the change in white point. Relative relationships of colors inside
+ both source and destination gamuts SHOULD be preserved.
+ Relative relationships of colors outside the destination gamut MAY be changed.
+ </div></dd>
<dt><span class='prop-value'>absolute-colorimetric</span></dt>
- <dd>Disables white point matching when converting
- colors. This option is generally not recommended.</dd>
+ <dd><p>ICC-absolute colorimetric is
+ required to leave source colors that fall inside the destination medium
+ gamut unchanged relative to the adopted white (a perfect reflecting
+ diffuser). Source colors that are out of the destination medium gamut
+ are mapped to colors on the gamut boundary using a variety of different
+ methods. This method produces the most accurate color matching of
+ in-gamut colors, but will result in highlight clipping if the
+ destination medium white point is lower than the source medium white
+ point. For this reason it is recommended for use <em>only</em> in applications
+ that need exact color matching and where highlight clipping is not a
+ concern.
+ </p>
+ <div class="requirement" id="assert_renderingIntentAbsoluteColorimetric">
+ This method MUST disable white point matching and black point matching when converting colors.
+ </div>
+ In general, this option is not recommended.</dd>
</dl>
<br />
<span class="anim-target"><a
href="animate.html#Animatable">Animatable</a>: no.</span>
</dd>
</dl>
</div>
-
+ <p class="issue">Fallback behaviour needs to be specified, for when the requested rendering intent does not have a corresponding table in the profile; or when all rendering-intents are provided using the same table.</p>
</edit:with>
<h3 id="ColorProfileAtRule">The CSS <strong>@color-profile</strong> rule</h3>
-<p>When the document is styled using CSS, the
+<p>When the document is styled using CSS, the CSS
<strong>@color-profile</strong> rule can be used to specify a color
profile description. The general form is:</p>
<pre>
@color-profile { <color-profile-description> }
</pre>
<p>where the <color-profile-description> has the form:</p>
@@ -449,97 +778,186 @@ child elements.</p>
</tr>
</table>
</dd>
</dl>
</div>
<p>See the description for the <a>'color-profile/rendering-intent'</a> attribute on the
<a>'color-profile element'</a> element.</p>
-
-<h3 id="ColorProfile">The <span class="property">'color-profile'</span> property</h3>
-
-<table class="propdef">
- <tr>
- <th>Name:</th>
- <td><dfn id="ColorProfileProperty">color-profile</dfn></td>
- </tr>
- <tr>
- <th>Value:</th>
- <td>auto | sRGB | <a><identifier></a> | <a><funciri></a></td>
- </tr>
- <tr>
- <th>Initial:</th>
- <td>none</td>
- </tr>
- <tr>
- <th>Applies to:</th>
- <td><a>'image'</a> elements that refer to raster images</td>
- </tr>
- <tr>
- <th>Inherited:</th>
- <td>yes</td>
- </tr>
- <tr>
- <th>Percentages:</th>
- <td>N/A</td>
- </tr>
- <tr>
- <th>Media:</th>
- <td>visual</td>
- </tr>
- <tr>
- <th>Computed value:</th>
- <td>as specified, but with <a><funciri></a> values made absolute</td>
- </tr>
- <tr>
- <th><a>Animatable</a>:</th>
- <td>yes</td>
- </tr>
-</table>
-
-<dl>
- <dt><span class='prop-value'>auto</span></dt>
- <dd>This is the default behavior. All colors are presumed to
- be defined in the sRGB color space unless a more precise
- embedded profile is specified within content data. For images
- that do have a profile built into their data, that profile is
- used. For images that do not have a profile, the sRGB profile
- is used.</dd>
-
- <dt><span class='prop-value'>sRGB</span></dt>
- <dd>
- <p>The source profile is assumed to be sRGB. This differs
- from auto in that it overrides an embedded profile inside an
- image.</p>
-
- <p>For consistency with <a href="http://www.w3.org/TR/2011/REC-CSS2-20110607/grammar.html#scanner">CSS lexical scanning and parsing rules</a>
- ([<a href="refs.html#ref-CSS21">CSS21</a>], section G.2), the keyword "sRGB" is
- case-insensitive; however, it is recommended that the mixed
- capitalization "sRGB" be used for consistency with common
- industry practice.</p>
- </dd>
-
- <dt><span class='prop-value'><a><identifier></a></span></dt>
- <dd>A name corresponding to a defined color profile that is
- in the user agent's color profile description database. The
- user agent searches the color profile description database
- for a <a href="color.html#ColorProfileDescriptions">color
- profile description</a> entry whose name descriptor matches
- <identifier> and uses the last matching entry that is found.
- If a match is found, the corresponding profile overrides an
- embedded profile inside an image. If no match is found, then
- the embedded profile inside the image is used.</dd>
-
- <dt><span class='prop-value'><a
- href="types.html#DataTypeIRI"><iri></a></span></dt>
- <dd>An <a>IRI reference</a> to the source color profile. The referenced
- color profile overrides an embedded profile inside the
- image.</dd>
-</dl>
+
+
+ <div class="ready-for-wider-review">
+ <h2 id="syntax">Color syntax</h2>
+ <p>The EBNF grammar is as used in the <a href="http://www.w3.org/TR/REC-xml/#sec-notation">XML specification</a>,
+ with the addition of a <em>case-insensitive literal</em>: characters in the ASCII range (only) are case-insensitive. ~"Hello" will match (H|h)(e|e)(l|L)(l|L)(o|O). This makes the productions much easier to read.</p>
+ <table>
+ <tr><td>?</td><td>optional, zero or one</td></tr>
+ <tr><td>+</td><td>one or more</td></tr>
+ <tr><td>*</td><td>zero or more</td></tr>
+ <tr><td>|</td><td>alternation</td></tr>
+ <tr><td>"string"</td><td>literal</td></tr>
+ <tr><td>~"string"</td><td>case-insensitive literal</td></tr>
+ <tr><td>[]</td><td>a character range</td></tr>
+ <tr><td>[^]</td><td>excluded character range</td></tr>
+ <tr><td>()</td><td>grouping</td></tr>
+ </table>
+
+
+ <pre>
+ <span id="icccolor">icccolor</span> ::=
+ ~"icc-color(" <a href="#name">name</a> (<a href="#comma-wsp">comma-wsp</a> <a href="#number">number</a>)+ ")"
+
+ <span id="iccnamedcolor">iccnamedcolor</span> ::=
+ ~"icc-named-color(" <a href="#name">name</a> <a href="#comma-wsp">comma-wsp</a> <a href="#namedColor">namedColor</a> ")"
+
+ <span id="cielabcolor">cielabcolor</span> ::=
+ ~"cielab(" <a href="#lightness">lightness</a> <a href="#comma-wsp">comma-wsp</a> <a href="#a-value">a-value</a> <a href="#comma-wsp">comma-wsp</a> <a href="#b-value">b-value</a> ")"
+
+ <span id="cielchabcolor">cielchabcolor</span> ::=
+ ~"cielchab(" <a href="#lightness">lightness</a> <a href="#comma-wsp">comma-wsp</a> <a href="#chroma">chroma</a> <a href="#comma-wsp">comma-wsp</a> <a href="#hue">hue</a> ")"
+
+ <span id="devicecolor">devicecolor</span> ::=
+ <a href="#devicegray">device-gray</a> | <a href="#devicergb">devicergb</a> | <a href="#devicecmyk">devicecmyk</a> | <a href="#devicenchannel">devicenchannel</a>
+
+ <span id="devicegray">devicegray</span> ::=
+ ~"device-gray(" <a href="#gray">gray</a> ")"
+
+ <span id="devicergb">devicergb</span> ::=
+ ~"device-rgb(" <a href="#red">red</a> <a href="#green">green</a> <a href="#blue">blue</a> ")"
+
+ <span id="devicecmyk">devicecmyk</span> ::=
+ ~"device-cmyk(" <a href="#cyan">cyan</a> <a href="#magenta">magenta</a> <a href="#yellow">yellow</a> ><a href="#black">black</a> ")"
+
+ <span id="devicenchannel">devicenchannel</span> ::=
+ ~"device-nchannel(" <a href="#number">number</a>+ ")"
+
+ <span id="name">name</span> ::=
+ <a href="#namestartchar">namestartchar</a> (<a href="#namechar">namechar</a>)*
+
+ <span id="lightness">lightness</span> ::=
+ <a href="#number">number</a>
+
+ <span id="a-value">a-value</span> ::=
+ <a href="#number">number</a>
+
+ <span id="b-value">b-value</span> ::=
+ <a href="#number">number</a>
+
+ <span id="chroma">chroma</span> ::=
+ <a href="#number">number</a>
+
+ <span id="hue">hue</span> ::=
+ <a href="#number">number</a>
+
+
+ <span id="gray">gray</span> ::=
+ <a href="#number">number</a>
+
+ <span id="red">red</span> ::=
+ <a href="#number">number</a>
+
+ <span id="green">green</span> ::=
+ <a href="#number">number</a>
+
+ <span id="blue">blue</span> ::=
+ <a href="#number">number</a>
+
+ <span id="cyan">cyan</span> ::=
+ <a href="#number">number</a>
+
+ <span id="magenta">magenta</span> ::=
+ <a href="#number">number</a>
+
+ <span id="yellow">yellow</span> ::=
+ <a href="#number">number</a>
+
+ <span id="black">black</span> ::=
+ <a href="#number">number</a>
+
+ <span id="namedColor">namedColor</span> ::=
+ <a href="#name">name</a>
+
+ <span id="fallback">fallback</span> ::=
+ <a href="#color">color</a>
+
+ <span id="color">color</span> ::=
+ "#" <a href="#hexdigit">hexdigit</a> <a href="#hexdigit">hexdigit</a> <a href="#hexdigit">hexdigit</a> (<a href="#hexdigit">hexdigit</a> <a href="#hexdigit">hexdigit</a> <a href="#hexdigit">hexdigit</a>)?
+ | ~"rgb(" <a href="#wsp">wsp</a>* <a href="#integer">integer</a> <a href="#comma">comma</a> <a href="#integer">integer</a> <a href="#comma">comma</a> <a href="#integer">integer</a> <a href="#wsp">wsp</a>* ")"
+ | ~"rgb(" <a href="#wsp">wsp</a>* <a href="#integer">integer</a> "%" <a href="#comma">comma</a> <a href="#integer">integer</a> "%" <a href="#comma">comma</a> <a href="#integer">integer</a> "%" <a href="#wsp">wsp</a>* ")"
+ | ~"hsl(" <a href="#wsp">wsp</a>* <a href="#integer">integer</a> <a href="#comma">comma</a> <a href="#integer">integer</a> <a href="#comma">comma</a> <a href="#integer">integer</a> <a href="#wsp">wsp</a>* ")"
+ | ~"hsla(" <a href="#wsp">wsp</a>* <a href="#integer">integer</a> <a href="#comma">comma</a> <a href="#integer">integer</a> <a href="#comma">comma</a> <a href="#integer">integer</a> <a href="#comma">comma</a> <a href="#integer">integer</a> <a href="#wsp">wsp</a>* ")"
+ | <a href="#color-keyword">color-keyword</a>
+
+ <span id="hexdigit">hexdigit</span> ::=
+ [0-9A-Fa-f]
+
+ <span id="number">number</span> ::=
+ <a href="#sign">sign</a>? <a href="#digit-sequence">digit-sequence</a>? "." <a href="#digit-sequence">digit-sequence</a>
+
+ <span id="sign">sign</span>::=
+ "+" | "-"
+
+ <span id="integer">integer</span> ::=
+ <a href="#digit-sequence">digit-sequence</a>
+
+ <span id="digit-sequence">digit-sequence</span> ::=
+ [0-9]+
+
+ <span id="namestartchar">namestartchar</span> ::=
+ ":" | [A-Z] | "_" | [a-z] | [#xC0-#xD6] | [#xD8-#xF6] | [
+ #xF8-#x2FF] | [#x370-#x37D] | [#x37F-#x1FFF] | [#x200C-#x200D] |
+ [#x2070-#x218F] | [#x2C00-#x2FEF] | [#x3001-#xD7FF] |
+ [#xF900-#xFDCF] | [#xFDF0-#xFFFD] | [#x10000-#xEFFFF]
+
+ <span id="namechar">namechar</span> ::=
+ <a href="#namestartchar">namestartchar</a> | "-" | "." | [0-9] | #xB7 | [#x0300-#x036F] |
+ [#x203F-#x2040]
+
+
+ <span id="comma-wsp">comma-wsp</span> ::=
+ (<a href="#wsp">wsp</a>+ <a href="#comma">comma</a>? <a href="#wsp">wsp</a>*) | (<a href="#comma">comma</a> <a href="#wsp">wsp</a>*)
+
+ <span id="comma">comma</span> ::=
+ ","
+
+ <span id="wsp">wsp</span> ::=
+ (#x20 | #x9 | #xD | #xA)
+
+ <span id="color-keyword">color-keyword</span> ::=
+ ~"aliceblue" | ~"antiquewhite" | ~"aqua" | ~"aquamarine" | ~"azure" | ~"beige" |
+ ~"bisque" | ~"black" | ~"blanchedalmond" | ~"blue" | ~"blueviolet" | ~"brown" |
+ ~"burlywood" |~"cadetblue" | ~"chartreuse" | ~"chocolate" | ~"coral" | ~"cornflowerblue" |
+ ~"cornsilk" | ~"crimson" | ~"cyan" | ~"darkblue" | ~"darkcyan" | ~"darkgoldenrod" |
+ ~"darkgray" | ~"darkgreen" | ~"darkgrey" | ~"darkkhaki" | ~"darkmagenta" | ~"darkolivegreen" |
+ ~"darkorange" | ~"darkorchid" | ~"darkred" | ~"darksalmon" | ~"darkseagreen" | ~"darkslateblue" |
+ ~"darkslategray" | ~"darkslategrey" | ~"darkturquoise" | ~"darkviolet" | ~"deeppink" | ~"deepskyblue" |
+ ~"dimgray" | ~"dimgrey" | ~"dodgerblue" | ~"firebrick" | ~"floralwhite" | ~"forestgreen" |
+ ~"fuchsia" | ~"gainsboro" | ~"ghostwhite" | ~"gold" | ~"goldenrod" | ~"gray" |
+ ~"grey" | ~"green" | ~"greenyellow" | ~"honeydew" | ~"hotpink" | ~"indianred" |
+ ~"indigo" | ~"ivory" | ~"khaki" | ~"lavender" | ~"lavenderblush" | ~"lawngreen" |
+ ~"lemonchiffon" | ~"lightblue" | ~"lightcoral" | ~"lightcyan" | ~"lightgoldenrodyellow" | ~"lightgray" |
+ ~"lightgreen" | ~"lightgrey" | ~"lightpink" | ~"lightsalmon" | ~"lightseagreen" | ~"lightskyblue" |
+ ~"lightslategray" | ~"lightslategrey" | ~"lightsteelblue" | ~"lightyellow" | ~"lime" |
+ ~"limegreen" | ~"linen" | ~"magenta" | ~"maroon" | ~"mediumaquamarine" | ~"mediumblue" |
+ ~"mediumorchid" | ~"mediumpurple" | ~"mediumseagreen" | ~"mediumslateblue" | ~"mediumspringgreen" | ~"mediumturquoise" |
+ ~"mediumvioletred" | ~"midnightblue" | ~"mintcream" | ~"mistyrose" | ~"moccasin" | ~"navajowhite" |
+ ~"navy" | ~"oldlace" | ~"olive" | ~"olivedrab" | ~"orange" | ~"orangered" |
+ ~"orchid" | ~"palegoldenrod" | ~"palegreen" | ~"paleturquoise" | ~"palevioletred" | ~"papayawhip" |
+ ~"peachpuff" | ~"peru" | ~"pink" | ~"plum" | ~"powderblue" | ~"purple" |
+ ~"red" | ~"rosybrown" | ~"royalblue" | ~"saddlebrown" | ~"salmon" | ~"sandybrown" |
+ ~"seagreen" | ~"seashell" | ~"sienna" | ~"silver" | ~"skyblue" | ~"slateblue" |
+ ~"slategray" | ~"slategrey" | ~"snow" | ~"springgreen" | ~"steelblue" | ~"tan" |
+ ~"teal" | ~"thistle" | ~"tomato" | ~"turquoise" | ~"violet" | ~"wheat" |
+ ~"white" | ~"whitesmoke" | ~"yellow" | ~"yellowgreen"
+ </pre>
+
+
+ </div>
+
<h2 id="DOMInterfaces">DOM interfaces</h2>
<h3 id="InterfaceSVGColorProfileElement">Interface SVGColorProfileElement</h3>
<edit:with element='color-profile'>
diff --git a/master/refs.html b/master/refs.html
--- a/master/refs.html
+++ b/master/refs.html
@@ -475,16 +475,21 @@
<br/>The <a href="http://www.w3.org/TR/xsl/">latest edition of XSL</a> is available at
http://www.w3.org/TR/xsl/.
</dd>
</dl>
<h2 id="InformativeReferences">Informative references</h2>
<dl class="references">
+ <dt id="ref-BRADFORD" class="informref">[BRADFORD]</dt>
+ <dd>Originally described in <cite>K.M. Lam, <i>Metamerism and Colour Constancy</i>,
+ Ph.D. Thesis, University of
+ Bradford, 1985.</cite>. The linearised Bradford is a simplificaton, widely used in practice, and expressible as a 3x3 matrix. See for example Lindbloom, <a href="http://www.brucelindbloom.com/index.html?Eqn_ChromAdapt.html">Chromatic Adaptation</a>.</dd>
+
<dt id="ref-CHARMOD" class="informref">[CHARMOD]</dt>
<dd>
<cite class="w3crec"><a href="http://www.w3.org/TR/2005/REC-charmod-20050215/">Character Model for the World Wide Web 1.0: Fundametnals</a></cite>,
M. Dürst, F. Yergeau, R. Ishida, M. Wolf, T. Texin, eds.
World Wide Web Consortium, 15 February 2005.
<br/>This edition of Charmod Fundamentals is http://www.w3.org/TR/2005/REC-charmod-20050215/.
<br/>The <a href="http://www.w3.org/TR/charmod/">latest edition of Charmod Fundamentals</a> is available at
http://www.w3.org/TR/charmod/.
diff --git a/master/style/default.css b/master/style/default.css
--- a/master/style/default.css
+++ b/master/style/default.css
@@ -156,17 +156,17 @@ code.css { font-family: inherit; font-si
code.html { color: #600 } /* inline HTML */
code.xml { color: #600 } /* inline XML */
.property { font: inherit; white-space: nowrap; } /* name of a CSS property (SPAN) */
.descriptor { } /* name of a CSS descriptor (SPAN) */
.type { font-style: italic } /* A <type> value for a property */
dfn { font-weight: bolder; /*font-size: 1em*/ }
-p.issue, div.issue, p.note, div.note, div.example {
+p.issue, div.issue, p.note, div.note, div.example, div.requirement {
padding: .5em;
border-left-width: .5em;
border-left-style: solid;
}
/* Open issue / editorial remark; not intended for a final publication */
p.issue, div.issue {
border-color: #E05252;
@@ -178,16 +178,27 @@ p.issue:before, div.issue:before {
content: "Issue " counter(issue);
padding-right: 1em;
text-transform: uppercase;
color: #E05252;
}
span.issue { color: red; }
+/* Conformance requirement */
+
+div.requirement {
+ border-color: #007070;
+ background: #A0E0E0;
+ }
+
+div.requirement > p {
+ margin-top: 0
+ }
+
/* Class note is a non-normative note. May be inline or a P or DIV */
p.note, div.note {
border-color: #52E052;
background: #E9FBE9;
}
span.note { color: green; }
Received on Monday, 20 August 2012 18:45:31 UTC