summaryrefslogtreecommitdiff
path: root/manuals/chickadee/Colors.html
diff options
context:
space:
mode:
Diffstat (limited to 'manuals/chickadee/Colors.html')
-rw-r--r--manuals/chickadee/Colors.html377
1 files changed, 377 insertions, 0 deletions
diff --git a/manuals/chickadee/Colors.html b/manuals/chickadee/Colors.html
new file mode 100644
index 0000000..3c62439
--- /dev/null
+++ b/manuals/chickadee/Colors.html
@@ -0,0 +1,377 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+<!-- Copyright (C) 2017-2020 David Thompson davet@gnu.org
+
+Permission is granted to copy, distribute and/or modify this document
+under the terms of the GNU Free Documentation License, Version 1.3
+or any later version published by the Free Software Foundation;
+with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts.
+A copy of the license is included in the section entitled "GNU
+Free Documentation License".
+
+A copy of the license is also available from the Free Software
+Foundation Web site at http://www.gnu.org/licenses/fdl.html.
+
+
+* Chickadee: (chickadee). Game programming toolkit for Guile.
+
+The document was typeset with
+http://www.texinfo.org/ (GNU Texinfo).
+ -->
+<!-- Created by GNU Texinfo 6.6, http://www.gnu.org/software/texinfo/ -->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+<title>Colors (The Chickadee Game Toolkit)</title>
+
+<meta name="description" content="Colors (The Chickadee Game Toolkit)">
+<meta name="keywords" content="Colors (The Chickadee Game Toolkit)">
+<meta name="resource-type" content="document">
+<meta name="distribution" content="global">
+<meta name="Generator" content="makeinfo">
+<link href="index.html#Top" rel="start" title="Top">
+<link href="Index.html#Index" rel="index" title="Index">
+<link href="index.html#SEC_Contents" rel="contents" title="Table of Contents">
+<link href="Graphics.html#Graphics" rel="up" title="Graphics">
+<link href="Textures.html#Textures" rel="next" title="Textures">
+<link href="Graphics.html#Graphics" rel="prev" title="Graphics">
+<style type="text/css">
+<!--
+a.summary-letter {text-decoration: none}
+blockquote.indentedblock {margin-right: 0em}
+div.display {margin-left: 3.2em}
+div.example {margin-left: 3.2em}
+div.lisp {margin-left: 3.2em}
+kbd {font-style: oblique}
+pre.display {font-family: inherit}
+pre.format {font-family: inherit}
+pre.menu-comment {font-family: serif}
+pre.menu-preformatted {font-family: serif}
+span.nolinebreak {white-space: nowrap}
+span.roman {font-family: initial; font-weight: normal}
+span.sansserif {font-family: sans-serif; font-weight: normal}
+ul.no-bullet {list-style: none}
+@media (min-width: 1140px) {
+ body {
+ margin-left: 14rem;
+ margin-right: 4rem;
+ max-width: 52rem;
+ }
+}
+
+@media (min-width: 800px) and (max-width: 1140px) {
+ body {
+ margin-left: 6rem;
+ margin-right: 4rem;
+ max-width: 52rem;
+ }
+}
+
+@media (max-width: 800px) {
+ body {
+ margin: 1rem;
+ }
+}
+
+-->
+</style>
+<link rel="stylesheet" type="text/css" href="https://dthompson.us/css/dthompson.css">
+
+
+</head>
+
+<body lang="en">
+<span id="Colors"></span><div class="header">
+<p>
+Next: <a href="Textures.html#Textures" accesskey="n" rel="next">Textures</a>, Up: <a href="Graphics.html#Graphics" accesskey="u" rel="up">Graphics</a> &nbsp; [<a href="index.html#SEC_Contents" title="Table of contents" rel="contents">Contents</a>][<a href="Index.html#Index" title="Index" rel="index">Index</a>]</p>
+</div>
+<hr>
+<span id="Colors-1"></span><h4 class="subsection">2.3.1 Colors</h4>
+
+<p>Merriam-Webster defines color as &ldquo;a phenomenon of light (such as red,
+brown, pink, or gray) or visual perception that enables one to
+differentiate otherwise identical objects.&rdquo; In this essay, I
+will&hellip;
+</p>
+<p>Okay, okay. We all know what colors are. Chickadee provides a data
+type to represent color and some convenient procedures to work with
+them in the <code>(chickadee render color)</code> module. Colors are made
+up of four components, or channels: red, green, blue, and alpha
+(transparency.) Each of these values is expressed as a uniform
+floating point value in the range [0, 1]. 0 means that color channel
+is unrepresented in the resulting color, whereas 1 means that color
+channel is at full intensity.
+</p>
+<p>Making a color object is easy, and there&rsquo;s a few ways to do it
+depending on what&rsquo;s most convenient. The first is <code>make-color</code>,
+where you specify each channel exactly as described above. This is
+fully opaque magenta:
+</p>
+<div class="example">
+<pre class="example">(make-color 1.0 0.0 1.0 1.0)
+</pre></div>
+
+<p>Many people are used to representing colors as 6 or 8 digit
+hexadecimal numbers, so Chickadee also allows that. Here&rsquo;s magenta,
+again:
+</p>
+<div class="example">
+<pre class="example">(rgba #xFF00FFFF)
+(rgb #xFF00FF) ; equivalent to the above
+</pre></div>
+
+<dl>
+<dt id="index-make_002dcolor">Procedure: <strong>make-color</strong> <em>r g b a</em></dt>
+<dd><p>Return a new color object with a red value of <var>r</var>, a green value
+of <var>g</var>, a blue value of <var>b</var>, and an alpha (transparency) value
+of <var>a</var>. All values are clamped to the range [0, 1].
+</p></dd></dl>
+
+<dl>
+<dt id="index-rgba">Procedure: <strong>rgba</strong> <em>color-code</em></dt>
+<dd><p>Return a new color object using the values of the first 32 bits of
+<var>color-code</var>. Each channel occupies 8 bits. Starting from the
+most significant bit, red is first, followed by green, then blue, then
+alpha. Color codes are often represented as 6 or 8 digit hexadecimal
+numbers in various other programs.
+</p></dd></dl>
+
+<dl>
+<dt id="index-rgb">Procedure: <strong>rgb</strong> <em>color-code</em></dt>
+<dd><p>Like <code>rgba</code>, but <var>color-code</var> is a 24 bit code with no alpha
+channel.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_003f">Procedure: <strong>color?</strong> <em>obj</em></dt>
+<dd><p>Return <code>#t</code> if <var>obj</var> is a color object.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002dr">Procedure: <strong>color-r</strong> <em>color</em></dt>
+<dd><p>Return the red channel of <var>color</var>.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002dg">Procedure: <strong>color-g</strong> <em>color</em></dt>
+<dd><p>Return the green channel of <var>color</var>.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002db">Procedure: <strong>color-b</strong> <em>color</em></dt>
+<dd><p>Return the blue channel of <var>color</var>.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002da">Procedure: <strong>color-a</strong> <em>color</em></dt>
+<dd><p>Return the alpha channel of <var>color</var>.
+</p></dd></dl>
+
+<dl>
+<dt id="index-transparency">Procedure: <strong>transparency</strong> <em>alpha</em></dt>
+<dd><p>Return a new color that is white (RGB channels set to 1) with an alpha
+channel value of <var>alpha</var>. This can be useful for creating a color
+that can be multiplied against another color to make it more
+transparent.
+</p></dd></dl>
+
+<dl>
+<dt id="index-string_002d_003ecolor">Procedure: <strong>string-&gt;color</strong> <em>s</em></dt>
+<dd><p>Convert the hexadecimal color code in the string <var>s</var> to a color
+object. The following string formats are supported:
+</p>
+<div class="example">
+<pre class="example">(string-&gt;color &quot;#FF00FFFF&quot;)
+(string-&gt;color &quot;FF00FFFF&quot;)
+(string-&gt;color &quot;#FF00FF&quot;)
+(string-&gt;color &quot;FF00FF&quot;)
+</pre></div>
+
+</dd></dl>
+
+<dl>
+<dt id="index-color_002a">Procedure: <strong>color*</strong> <em>a b</em></dt>
+<dd><p>Multiply the color <var>a</var> with the color or number <var>b</var> and return
+a new color with the result.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002b">Procedure: <strong>color+</strong> <em>a b</em></dt>
+<dd><p>Add the color <var>a</var> to the color <var>b</var> and return a new color with
+the result.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002d">Procedure: <strong>color-</strong> <em>a b</em></dt>
+<dd><p>Subtract the color <var>b</var> from the color <var>a</var> and return a new
+color with the result.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002dinverse">Procedure: <strong>color-inverse</strong> <em>color</em></dt>
+<dd><p>Invert the red, green, and blue channels of <var>color</var> and return a
+new color with the result.
+</p></dd></dl>
+
+<dl>
+<dt id="index-color_002dlerp">Procedure: <strong>color-lerp</strong> <em>start end alpha</em></dt>
+<dd><p>Linearly interpolate the colors <var>start</var> and <var>end</var> using the
+factor <var>alpha</var>, a number in the range [0, 1].
+</p></dd></dl>
+
+<span id="Stock-Colors"></span><h4 class="subsubsection">2.3.1.1 Stock Colors</h4>
+
+<p>For convenience, Chickadee comes with some basic colors predefined:
+</p>
+<dl>
+<dt id="index-white">Variable: <strong>white</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-black">Variable: <strong>black</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-red">Variable: <strong>red</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-green">Variable: <strong>green</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-blue">Variable: <strong>blue</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-yellow">Variable: <strong>yellow</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-magenta">Variable: <strong>magenta</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-cyan">Variable: <strong>cyan</strong></dt>
+</dl>
+
+<p>For fun, there are also predefined colors for the classic
+<a href="https://en.wikipedia.org/wiki/Tango_Desktop_Project#Palette">Tango color palette</a>.
+</p>
+<dl>
+<dt id="index-tango_002dlight_002dbutter">Variable: <strong>tango-light-butter</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dbutter">Variable: <strong>tango-butter</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002ddark_002dbutter">Variable: <strong>tango-dark-butter</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dlight_002dorange">Variable: <strong>tango-light-orange</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dorange">Variable: <strong>tango-orange</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002ddark_002dorange">Variable: <strong>tango-dark-orange</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dlight_002dchocolate">Variable: <strong>tango-light-chocolate</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dchocolate">Variable: <strong>tango-chocolate</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002ddark_002dchocolate">Variable: <strong>tango-dark-chocolate</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dlight_002dchameleon">Variable: <strong>tango-light-chameleon</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dchameleon">Variable: <strong>tango-chameleon</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002ddark_002dchameleon">Variable: <strong>tango-dark-chameleon</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dlight_002dsky_002dblue">Variable: <strong>tango-light-sky-blue</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dsky_002dblue">Variable: <strong>tango-sky-blue</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002ddark_002dsky_002dblue">Variable: <strong>tango-dark-sky-blue</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dlight_002dplum">Variable: <strong>tango-light-plum</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dplum">Variable: <strong>tango-plum</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002ddark_002dplum">Variable: <strong>tango-dark-plum</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dlight_002dscarlet_002dred">Variable: <strong>tango-light-scarlet-red</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002dscarlet_002dred">Variable: <strong>tango-scarlet-red</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002ddark_002dscarlet_002dred">Variable: <strong>tango-dark-scarlet-red</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002daluminium_002d1">Variable: <strong>tango-aluminium-1</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002daluminium_002d2">Variable: <strong>tango-aluminium-2</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002daluminium_002d3">Variable: <strong>tango-aluminium-3</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002daluminium_002d4">Variable: <strong>tango-aluminium-4</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002daluminium_002d5">Variable: <strong>tango-aluminium-5</strong></dt>
+</dl>
+
+<dl>
+<dt id="index-tango_002daluminium_002d6">Variable: <strong>tango-aluminium-6</strong></dt>
+</dl>
+
+<hr>
+<div class="header">
+<p>
+Next: <a href="Textures.html#Textures" accesskey="n" rel="next">Textures</a>, Up: <a href="Graphics.html#Graphics" accesskey="u" rel="up">Graphics</a> &nbsp; [<a href="index.html#SEC_Contents" title="Table of contents" rel="contents">Contents</a>][<a href="Index.html#Index" title="Index" rel="index">Index</a>]</p>
+</div>
+
+
+
+</body>
+</html>