Open Source Software Technical Articles

Want the Best of the Wazi Blogs Delivered Directly to your Inbox?

Subscribe to Wazi by Email

Your email:

Connect with Us!

Current Articles | RSS Feed RSS Feed

A more colorful LibreOffice unveiled

  
  
  

In the first article in this series I pointed out some problems I and other LibreOffice users have with the standard LibreOffice color palette, and I talked about how colors are specified, both on computers in general and within LibreOffice .soc files. Let's now see how to generate a new set of colors.

The process requires finding some base colors to start with and scripting some code to build darker and lighter variations of them. Since I'm not particularly gifted (rather the contrary!) in artistic color-related work, I needed to get my colors from someplace. The World Wide Web Consortium (W3C) provides a list of color names as used in CSS (cascading style sheets). However, that list is in alphabetic order, and I'd rather group colors in families (reds, greens, blues, browns, and so on). A Wikipedia article provides a suitable table. With some cutting, pasting, and minor editing, I ended with the following text file:

REDS
IndianRed CD 5C 5C 205 92 92
LightCoral F0 80 80 240 128 128
Salmon FA 80 72 250 128 114
DarkSalmon E9 96 7A 233 150 122
LightSalmon FF A0 7A 255 160 122
Red FF 00 00 255 0 0
Crimson DC 14 3C 220 20 60
FireBrick B2 22 22 178 34 34
DarkRed 8B 00 00 139 0 0

PINKS
Pink FF C0 CB 255 192 203
LightPink FF B6 C1 255 182 193
HotPink FF 69 B4 255 105 180

...many lines snipped out...

DimGray 69 69 69 105 105 105
LightSlateGray 77 88 99 119 136 153
SlateGray 70 80 90 112 128 144
DarkSlateGray 2F 4F 4F 47 79 79
Black 00 00 00 0 0 0

I left blank lines for clarity; our script will ignore them. Lines with a single name identify color families, whose names I took from the web page. (You'll see why I kept those lines in a little bit.) Other lines have seven fields: a color name, the three hexadecimal RGB values, and their three decimal equivalents; we won't be using the hex values, but leaving them was simpler than removing them! We'll use this basic color table as a basis for our color variations, after we tweak it a bit.

The W3C also defines the 16 basic colors supported with by Windows VGA palette. I added them to the top of the colors table. Finding the decimal equivalents is easy, since the only hex numbers that appear are 00, 80, C0, and FF, which are 0, 128, 192, and 255 in base 10. I call this family "BASIC," and I opted to give its colors all-uppercase names. These colors are duplicated elsewhere in the X11 colors table, but being able to find, say, red, at two different places is no big deal.

BASIC
WHITE FF FF FF 255 255 255
SILVER C0 C0 C0 192 192 192
GRAY 80 80 80 128 128 128
BLACK 00 00 00 0 0 0
RED FF 00 00 255 0 0
MAROON 80 00 00 128 0 0
YELLOW FF FF 00 255 255 0
OLIVE 80 80 00 128 128 0
LIME 00 FF 00 0 255 0
GREEN 00 80 00 0 128 0
AQUA 00 FF FF 0 255 255
TEAL 00 80 80 0 128 128
BLUE 00 00 FF 0 0 255
NAVY 00 00 80 0 0 128
FUCHSIA FF 00 FF 255 0 255
PURPLE 80 00 80 128 0 128

Finally, after some experimenting, I noted that a couple of nice LibreOffice colors, Pale Yellow and Pale Green (actually, more like Pale Cyan) were missing. Looking at the standard LibreOffice colors list I found that Pale Yellow was (255, 255, 204), and Pale Green was (204, 255, 255). Noticing the pattern, I also tried out the (255, 204, 255) combination, and got a Pale Rose. Since I like these three colors, I added them in the Yellow, Pinks, and Blues families; 204 is CC in hexadecimal, if you are curious.

PaleYellow FF FF CC 255 255 204
PalePink FF CC FF 255 204 255
PaleCyan CC FF FF 204 255 255

The full list is in the downloadable file colors.x11. At this point, we have a satisfactory table with all the basic X11 colors plus some additions, from which we can derive as many variations as we please. Time for some scripting!

Getting color variants

Let's say we want to produce some variations of color (240,64,128), a sort of dark pink. We want to get both lighter and darker versions of it, so we have to modify its R, G and B values appropriately.

Suppose we want to create four darker variations, ending up in black. Given that the R component must go from 0 (darkest) to 240 (the original color) in four steps, the three intermediate colors we'll need will have R values of 60, 120 and 180; the G component will be 16, 32, and 48, and the B component 32, 64, and 96. Thus, the three colors we'll produce are (60, 16, 32), (120, 32, 64), and (180, 48, 96). Similarly, the three lighter colors will be (244, 112, 160), (248, 160, 192), and (252, 208, 224).

Each color component (R, G, B) varies in linear fashion to the  extremes, black and white  Each darker or lighter variation corresponds to a proportional decrease  or increase in its R, G, and B components

Of course, you could have any number of variations other than four, and you need not have the same number of darker and lighter versions. Also note that not all variations are really interesting; as you go to the extremes, they become either too dark or too light, so you'll probably want to pick just a few of all the available colors, most likely centered around the original one.

Now that we know how to produce variations from a given color, we can script the process with awk. Awk is an interpreted programming language, standard in Unix and Linux environments, often used for processing text files. Its name comes from the last names of its creators: Aho, Weinberger, and Kernighan. An awk program consists in a series of conditions and actions. Each input line is tested, and if a condition is satisfied, awk executes the corresponding actions, programmed in a C-like language. Conditions usually involve pattern-matching to regular expressions, which makes awk suitable for text file processing. Two special conditions, BEGIN and END, are respectively satisfied at the beginning of the program run and when no more input is available. You can execute short awk programs – one-liners – directly from the command line for simple transformations.

Producing the actual tables

Since the transformations needed to build a color palette from the color list aren't that hard, the full program turns out to be just a few lines long. Given the .soc format that we saw in the last article, what we basically require is:

  • At the beginning, output two header lines, the ones beginning with "<?xml..." and "<ooo:color-table..."
  • For each color in our list, output several "<draw:color" lines
  • Output a closing "</ooo:color-table>" footer line

How many variations of each color should we produce? LibreOffice shows colors eight in a row, so producing a multiple of eight colors would look good. Using another number would cause LibreOffice to split the variations over different lines – not so clear. I started by splitting the range from the extremes (black and white) to each color in six steps. After examining the resulting colors, I decided to keep four lighter variations, the original color, and three darker variations; other variations end up looking too similar to white or black. Here's the first part of the colors.awk script; you can download the complete script.

BEGIN {
  # We'll create 8 variations of each color; 4
  # lighter ones, plus the original color, plus 3
  # darker ones. We'll split the range between the
  # color and black or white in 6 steps, so there
  # will be a margin between the extremes and our
  # variations.
  VARIATIONS = 8
  INITIAL = 4
  STEPS = 6

  # The following constants come in handy
  # to shorten printf lines for publication
  DC = "draw:color"
  DN = "draw:name"
  UR = "urn:oasis:names:tc:opendocument:"
  XM = "xmlns:"

  # Print the header for the color table
  printf "<?xml version='1.0' " \
    "encoding='UTF-8'?>\n" \
    "<ooo:color-table\n" \
    XM "office='" UR XM "office:1.0' \n" \
    XM "draw='" UR XM "drawing:1.0'\n" \
    XM "xlink='http://www.w3.org/1999/xlink'\n" \
    XM "svg='http://www.w3.org/2000/svg'\n" \
    XM "ooo='http://openoffice.org/2004/office'>\n"
}

Generating color variations is simple math, but how shall we name the colors we produce? I incorporated the family name of each color to produce names such as REDS/LightCoral, PINKS/HotPink, and PURPLES/Thistle, because then by just typing the first letters of a family color, LibreOffice immediately moves to the colors in that family. To distinguish colors, I added "+1," "+2," etc., to the lighter variations, and "-1," "-2," etc., to the darker ones. I also decided not to make variations of the basic VGA colors, given that they are duplicated elsewhere in the color list.

Finding colors is easier if each color name is preceded by the family  name

The main loop of the awk script matches:

  • empty lines, which are just ignored
  • lines with a single field (family names), which are saved for later
  • lines in the BASIC family, which produce just a single color, no variations at all
  • lines in other families, which produce a number of variations.

In the code, $1, $2, etc., refer to the fields in the line, so $1 is a color name, and $5 to $7 its RGB components. We need a round() function of our own, because awk doesn't provide one. Here's the body of the script:

NF==1 {
  colorPrefix = $1
}

NF==7 && colorPrefix=="BASIC" {
  printf "<" DC " " DN "='BASIC/%s' " \
    DC "='#%02x%02x%02x'/>\n", \
    $1, $5, $6, $7
}

NF==7 && colorPrefix!="BASIC" {
  for (i=INITIAL; i>INITIAL-VARIATIONS; i--) {
    if (i<0) {
      red = $5 + round(i * $5 / STEPS)
      green = $6 + round(i * $6 / STEPS)
      blue = $7 + round(i * $7 / STEPS)
    } else {
      red = $5 + round(i * (255-$5) / STEPS)
      green = $6 + round(i * (255-$6) / STEPS)
      blue = $7 + round(i * (255-$7) / STEPS)
    }

    if (i==0) {
      printf "<" DC " " DN "='%s/%s' " \
        DC "='#%02x%02x%02x'/>\n", \
        colorPrefix, $1, red, green, blue
    } else {
      printf "<" DC " " DN "='%s/%s%+i' " \
        DC "='#%02x%02x%02x'/>\n", \
        colorPrefix, $1, i, red, green, blue
    }
  }
}

function round(r) {
  return int(0.5 + r);
}

We print hex digits with the '#%02x%02x%02x' format string. After this code, we just have to output the required XML footer for the color list:

END {
  # Print the footer for the color table
  print "</ooo:color-table>\n"
}

Running this script is simple: awk -f colors.awk <colors.x11 >pick.a.name.soc. I called my file colors.soc.

Copy the newly produced file to your LibreOffice directory and rename it standard.soc so LibreOffice will use it by default, after first renaming the original standard.soc file to original.soc, just in case you want to go back to it.

The result of our work - a nice table with plenty of nicely graded color  variations

After you look at your new color table, you might consider going down to four colors if eight are too many. For less stark color graduations, increase the number of steps; fewer steps produce higher contrasts. You might pare down the GRAYS and WHITES families. Finally, you might want to include the "Chart" colors LibreOffice uses, with no variations (as with the BASIC color family) and no renaming.

In conclusion

Open standards mean that you'll rarely be stuck with a problem if you are willing to do some work. In this instance, we were able to extend LibreOffice with a full color library, to allow us to work with presentations, spreadsheets, and other documents using a more attractive palette.




This work is licensed under a Creative Commons Attribution 3.0 Unported License
Creative Commons License.

Comments

Thank you for an interesting and useful article. I mainly use colours for cell backgrounds in spreadsheets, and have found the off-the-shelf colours provided by LibreOffice Calc rather limited, so your article is of immediate interest to me.
Posted @ Friday, May 17, 2013 9:22 AM by Fitzcarraldo
Glad I could help, then!
Posted @ Friday, May 17, 2013 3:57 PM by Federico Kereki
Thank you Federico for your article. I had been working in some simmilar subjet last summer (austtral). I also build a sheet with charts of the gradients used to generate the colors. But at the end, I code an algorithm in Fortran to generate a palette much like MS Office 2097, given 8 colors. I used Fortran just because is rhe lenguage I use the most and I feel confortable with, bit if you are interested, it will be easy to translate it to BASH.
Posted @ Wednesday, May 29, 2013 2:07 PM by phorious
Thanks, Federico, for a really useful article. This was a simple and fun implementation, good awk, and now my LibreOffice color palette is much richer and more useful! Like Fitzcarraldo, I use colors a lot for backgrounding spreadsheet cells, and the lighter and more varied the palette, the better! Thanks again!
Posted @ Wednesday, June 19, 2013 6:03 PM by Lorin Ricker
Thank you for doing this! I didn't even know that there was a way to change the set of colors LibreOffice used - that was one of the main reasons I still use Microsoft Office. There's still some functionality I like in MS Office over LibreOffice, but this was a big one. Like the above commentors, this will come much in handy for me when working with spreadsheets.
Posted @ Monday, July 15, 2013 4:11 PM by Will Beason
Here is a web_safe.sog 
<?xml version="1.0" encoding="UTF-8"?> 
 
<office:color-table xmlns:office="http://openoffice.org/2000/office" xmlns:style="http://openoffice.org/2000/style" xmlns:text="http://openoffice.org/2000/text" xmlns:table="http://openoffice.org/2000/table" xmlns:draw="http://openoffice.org/2000/drawing" xmlns:fo="http://www.w3.org/1999/XSL/Format" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:meta="http://openoffice.org/2000/meta" xmlns:number="http://openoffice.org/2000/datastyle" xmlns:svg="http://www.w3.org/2000/svg" xmlns:chart="http://openoffice.org/2000/chart" xmlns:dr3d="http://openoffice.org/2000/dr3d" xmlns:math="http://www.w3.org/1998/Math/MathML" xmlns:form="http://openoffice.org/2000/form" xmlns:script="http://openoffice.org/2000/script"> 
<draw:color draw:name="000000" draw:color="#000000"/> 
<draw:color draw:name="330000" draw:color="#330000"/> 
<draw:color draw:name="660000" draw:color="#660000"/> 
<draw:color draw:name="990000" draw:color="#990000"/> 
<draw:color draw:name="CC0000" draw:color="#CC0000"/> 
<draw:color draw:name="FF0000" draw:color="#FF0000"/> 
<draw:color draw:name="000033" draw:color="#000033"/> 
<draw:color draw:name="330033" draw:color="#330033"/> 
<draw:color draw:name="660033" draw:color="#660033"/> 
<draw:color draw:name="990033" draw:color="#990033"/> 
<draw:color draw:name="CC0033" draw:color="#CC0033"/> 
<draw:color draw:name="FF0033" draw:color="#FF0033"/> 
<draw:color draw:name="000066" draw:color="#000066"/> 
<draw:color draw:name="330066" draw:color="#330066"/> 
<draw:color draw:name="660066" draw:color="#660066"/> 
<draw:color draw:name="990066" draw:color="#990066"/> 
<draw:color draw:name="CC0066" draw:color="#CC0066"/> 
<draw:color draw:name="FF0066" draw:color="#FF0066"/> 
<draw:color draw:name="000099" draw:color="#000099"/> 
<draw:color draw:name="330099" draw:color="#330099"/> 
<draw:color draw:name="660099" draw:color="#660099"/> 
<draw:color draw:name="990099" draw:color="#990099"/> 
<draw:color draw:name="CC0099" draw:color="#CC0099"/> 
<draw:color draw:name="FF0099" draw:color="#FF0099"/> 
<draw:color draw:name="0000CC" draw:color="#0000CC"/> 
<draw:color draw:name="3300CC" draw:color="#3300CC"/> 
<draw:color draw:name="6600CC" draw:color="#6600CC"/> 
<draw:color draw:name="9900CC" draw:color="#9900CC"/> 
<draw:color draw:name="CC00CC" draw:color="#CC00CC"/> 
<draw:color draw:name="FF00CC" draw:color="#FF00CC"/> 
<draw:color draw:name="0000FF" draw:color="#0000FF"/> 
<draw:color draw:name="3300FF" draw:color="#3300FF"/> 
<draw:color draw:name="6600FF" draw:color="#6600FF"/> 
<draw:color draw:name="9900FF" draw:color="#9900FF"/> 
<draw:color draw:name="CC00FF" draw:color="#CC00FF"/> 
<draw:color draw:name="FF00FF" draw:color="#FF00FF"/> 
<draw:color draw:name="003300" draw:color="#003300"/> 
<draw:color draw:name="333300" draw:color="#333300"/> 
<draw:color draw:name="663300" draw:color="#663300"/> 
<draw:color draw:name="993300" draw:color="#993300"/> 
<draw:color draw:name="CC3300" draw:color="#CC3300"/> 
<draw:color draw:name="FF3300" draw:color="#FF3300"/> 
<draw:color draw:name="003333" draw:color="#003333"/> 
<draw:color draw:name="333333" draw:color="#333333"/> 
<draw:color draw:name="663333" draw:color="#663333"/> 
<draw:color draw:name="993333" draw:color="#993333"/> 
<draw:color draw:name="CC3333" draw:color="#CC3333"/> 
<draw:color draw:name="FF3333" draw:color="#FF3333"/> 
<draw:color draw:name="003366" draw:color="#003366"/> 
<draw:color draw:name="333366" draw:color="#333366"/> 
<draw:color draw:name="663366" draw:color="#663366"/> 
<draw:color draw:name="993366" draw:color="#993366"/> 
<draw:color draw:name="CC3366" draw:color="#CC3366"/> 
<draw:color draw:name="FF3366" draw:color="#FF3366"/> 
<draw:color draw:name="003399" draw:color="#003399"/> 
<draw:color draw:name="333399" draw:color="#333399"/> 
<draw:color draw:name="663399" draw:color="#663399"/> 
<draw:color draw:name="993399" draw:color="#993399"/> 
<draw:color draw:name="CC3399" draw:color="#CC3399"/> 
<draw:color draw:name="FF3399" draw:color="#FF3399"/> 
<draw:color draw:name="0033CC" draw:color="#0033CC"/> 
<draw:color draw:name="3333CC" draw:color="#3333CC"/> 
<draw:color draw:name="6633CC" draw:color="#6633CC"/> 
<draw:color draw:name="9933CC" draw:color="#9933CC"/> 
<draw:color draw:name="CC33CC" draw:color="#CC33CC"/> 
<draw:color draw:name="FF33CC" draw:color="#FF33CC"/> 
<draw:color draw:name="0033FF" draw:color="#0033FF"/> 
<draw:color draw:name="3333FF" draw:color="#3333FF"/> 
<draw:color draw:name="6633FF" draw:color="#6633FF"/> 
<draw:color draw:name="9933FF" draw:color="#9933FF"/> 
<draw:color draw:name="CC33FF" draw:color="#CC33FF"/> 
<draw:color draw:name="FF33FF" draw:color="#FF33FF"/> 
<draw:color draw:name="006600" draw:color="#006600"/> 
<draw:color draw:name="336600" draw:color="#336600"/> 
<draw:color draw:name="666600" draw:color="#666600"/> 
<draw:color draw:name="996600" draw:color="#996600"/> 
<draw:color draw:name="CC6600" draw:color="#CC6600"/> 
<draw:color draw:name="FF6600" draw:color="#FF6600"/> 
<draw:color draw:name="006633" draw:color="#006633"/> 
<draw:color draw:name="336633" draw:color="#336633"/> 
<draw:color draw:name="666633" draw:color="#666633"/> 
<draw:color draw:name="996633" draw:color="#996633"/> 
<draw:color draw:name="CC6633" draw:color="#CC6633"/> 
<draw:color draw:name="FF6633" draw:color="#FF6633"/> 
<draw:color draw:name="006666" draw:color="#006666"/> 
<draw:color draw:name="336666" draw:color="#336666"/> 
<draw:color draw:name="666666" draw:color="#666666"/> 
<draw:color draw:name="996666" draw:color="#996666"/> 
<draw:color draw:name="CC6666" draw:color="#CC6666"/> 
<draw:color draw:name="FF6666" draw:color="#FF6666"/> 
<draw:color draw:name="006699" draw:color="#006699"/> 
<draw:color draw:name="336699" draw:color="#336699"/> 
<draw:color draw:name="666699" draw:color="#666699"/> 
<draw:color draw:name="996699" draw:color="#996699"/> 
<draw:color draw:name="CC6699" draw:color="#CC6699"/> 
<draw:color draw:name="FF6699" draw:color="#FF6699"/> 
<draw:color draw:name="0066CC" draw:color="#0066CC"/> 
<draw:color draw:name="3366CC" draw:color="#3366CC"/> 
<draw:color draw:name="6666CC" draw:color="#6666CC"/> 
<draw:color draw:name="9966CC" draw:color="#9966CC"/> 
<draw:color draw:name="CC66CC" draw:color="#CC66CC"/> 
<draw:color draw:name="FF66CC" draw:color="#FF66CC"/> 
<draw:color draw:name="0066FF" draw:color="#0066FF"/> 
<draw:color draw:name="3366FF" draw:color="#3366FF"/> 
<draw:color draw:name="6666FF" draw:color="#6666FF"/> 
<draw:color draw:name="9966FF" draw:color="#9966FF"/> 
<draw:color draw:name="CC66FF" draw:color="#CC66FF"/> 
<draw:color draw:name="FF66FF" draw:color="#FF66FF"/> 
<draw:color draw:name="009900" draw:color="#009900"/> 
<draw:color draw:name="339900" draw:color="#339900"/> 
<draw:color draw:name="669900" draw:color="#669900"/> 
<draw:color draw:name="999900" draw:color="#999900"/> 
<draw:color draw:name="CC9900" draw:color="#CC9900"/> 
<draw:color draw:name="FF9900" draw:color="#FF9900"/> 
<draw:color draw:name="009933" draw:color="#009933"/> 
<draw:color draw:name="339933" draw:color="#339933"/> 
<draw:color draw:name="669933" draw:color="#669933"/> 
<draw:color draw:name="999933" draw:color="#999933"/> 
<draw:color draw:name="CC9933" draw:color="#CC9933"/> 
<draw:color draw:name="FF9933" draw:color="#FF9933"/> 
<draw:color draw:name="009966" draw:color="#009966"/> 
<draw:color draw:name="339966" draw:color="#339966"/> 
<draw:color draw:name="669966" draw:color="#669966"/> 
<draw:color draw:name="999966" draw:color="#999966"/> 
<draw:color draw:name="CC9966" draw:color="#CC9966"/> 
<draw:color draw:name="FF9966" draw:color="#FF9966"/> 
<draw:color draw:name="009999" draw:color="#009999"/> 
<draw:color draw:name="339999" draw:color="#339999"/> 
<draw:color draw:name="669999" draw:color="#669999"/> 
<draw:color draw:name="999999" draw:color="#999999"/> 
<draw:color draw:name="CC9999" draw:color="#CC9999"/> 
<draw:color draw:name="FF9999" draw:color="#FF9999"/> 
<draw:color draw:name="0099CC" draw:color="#0099CC"/> 
<draw:color draw:name="3399CC" draw:color="#3399CC"/> 
<draw:color draw:name="6699CC" draw:color="#6699CC"/> 
<draw:color draw:name="9999CC" draw:color="#9999CC"/> 
<draw:color draw:name="CC99CC" draw:color="#CC99CC"/> 
<draw:color draw:name="FF99CC" draw:color="#FF99CC"/> 
<draw:color draw:name="0099FF" draw:color="#0099FF"/> 
<draw:color draw:name="3399FF" draw:color="#3399FF"/> 
<draw:color draw:name="6699FF" draw:color="#6699FF"/> 
<draw:color draw:name="9999FF" draw:color="#9999FF"/> 
<draw:color draw:name="CC99FF" draw:color="#CC99FF"/> 
<draw:color draw:name="FF99FF" draw:color="#FF99FF"/> 
<draw:color draw:name="00CC00" draw:color="#00CC00"/> 
<draw:color draw:name="33CC00" draw:color="#33CC00"/> 
<draw:color draw:name="66CC00" draw:color="#66CC00"/> 
<draw:color draw:name="99CC00" draw:color="#99CC00"/> 
<draw:color draw:name="CCCC00" draw:color="#CCCC00"/> 
<draw:color draw:name="FFCC00" draw:color="#FFCC00"/> 
<draw:color draw:name="00CC33" draw:color="#00CC33"/> 
<draw:color draw:name="33CC33" draw:color="#33CC33"/> 
<draw:color draw:name="66CC33" draw:color="#66CC33"/> 
<draw:color draw:name="99CC33" draw:color="#99CC33"/> 
<draw:color draw:name="CCCC33" draw:color="#CCCC33"/> 
<draw:color draw:name="FFCC33" draw:color="#FFCC33"/> 
<draw:color draw:name="00CC66" draw:color="#00CC66"/> 
<draw:color draw:name="33CC66" draw:color="#33CC66"/> 
<draw:color draw:name="66CC66" draw:color="#66CC66"/> 
<draw:color draw:name="99CC66" draw:color="#99CC66"/> 
<draw:color draw:name="CCCC66" draw:color="#CCCC66"/> 
<draw:color draw:name="FFCC66" draw:color="#FFCC66"/> 
<draw:color draw:name="00CC99" draw:color="#00CC99"/> 
<draw:color draw:name="33CC99" draw:color="#33CC99"/> 
<draw:color draw:name="66CC99" draw:color="#66CC99"/> 
<draw:color draw:name="99CC99" draw:color="#99CC99"/> 
<draw:color draw:name="CCCC99" draw:color="#CCCC99"/> 
<draw:color draw:name="FFCC99" draw:color="#FFCC99"/> 
<draw:color draw:name="00CCCC" draw:color="#00CCCC"/> 
<draw:color draw:name="33CCCC" draw:color="#33CCCC"/> 
<draw:color draw:name="66CCCC" draw:color="#66CCCC"/> 
<draw:color draw:name="99CCCC" draw:color="#99CCCC"/> 
<draw:color draw:name="CCCCCC" draw:color="#CCCCCC"/> 
<draw:color draw:name="FFCCCC" draw:color="#FFCCCC"/> 
<draw:color draw:name="00CCFF" draw:color="#00CCFF"/> 
<draw:color draw:name="33CCFF" draw:color="#33CCFF"/> 
<draw:color draw:name="66CCFF" draw:color="#66CCFF"/> 
<draw:color draw:name="99CCFF" draw:color="#99CCFF"/> 
<draw:color draw:name="CCCCFF" draw:color="#CCCCFF"/> 
<draw:color draw:name="FFCCFF" draw:color="#FFCCFF"/> 
<draw:color draw:name="00FF00" draw:color="#00FF00"/> 
<draw:color draw:name="33FF00" draw:color="#33FF00"/> 
<draw:color draw:name="66FF00" draw:color="#66FF00"/> 
<draw:color draw:name="99FF00" draw:color="#99FF00"/> 
<draw:color draw:name="CCFF00" draw:color="#CCFF00"/> 
<draw:color draw:name="FFFF00" draw:color="#FFFF00"/> 
<draw:color draw:name="00FF33" draw:color="#00FF33"/> 
<draw:color draw:name="33FF33" draw:color="#33FF33"/> 
<draw:color draw:name="66FF33" draw:color="#66FF33"/> 
<draw:color draw:name="99FF33" draw:color="#99FF33"/> 
<draw:color draw:name="CCFF33" draw:color="#CCFF33"/> 
<draw:color draw:name="FFFF33" draw:color="#FFFF33"/> 
<draw:color draw:name="00FF66" draw:color="#00FF66"/> 
<draw:color draw:name="33FF66" draw:color="#33FF66"/> 
<draw:color draw:name="66FF66" draw:color="#66FF66"/> 
<draw:color draw:name="99FF66" draw:color="#99FF66"/> 
<draw:color draw:name="CCFF66" draw:color="#CCFF66"/> 
<draw:color draw:name="FFFF66" draw:color="#FFFF66"/> 
<draw:color draw:name="00FF99" draw:color="#00FF99"/> 
<draw:color draw:name="33FF99" draw:color="#33FF99"/> 
<draw:color draw:name="66FF99" draw:color="#66FF99"/> 
<draw:color draw:name="99FF99" draw:color="#99FF99"/> 
<draw:color draw:name="CCFF99" draw:color="#CCFF99"/> 
<draw:color draw:name="FFFF99" draw:color="#FFFF99"/> 
<draw:color draw:name="00FFCC" draw:color="#00FFCC"/> 
<draw:color draw:name="33FFCC" draw:color="#33FFCC"/> 
<draw:color draw:name="66FFCC" draw:color="#66FFCC"/> 
<draw:color draw:name="99FFCC" draw:color="#99FFCC"/> 
<draw:color draw:name="CCFFCC" draw:color="#CCFFCC"/> 
<draw:color draw:name="FFFFCC" draw:color="#FFFFCC"/> 
<draw:color draw:name="00FFFF" draw:color="#00FFFF"/> 
<draw:color draw:name="33FFFF" draw:color="#33FFFF"/> 
<draw:color draw:name="66FFFF" draw:color="#66FFFF"/> 
<draw:color draw:name="99FFFF" draw:color="#99FFFF"/> 
<draw:color draw:name="CCFFFF" draw:color="#CCFFFF"/> 
<draw:color draw:name="FFFFFF" draw:color="#FFFFFF"/> 
</office:color-table>
Posted @ Sunday, August 10, 2014 2:53 PM by Jim Blake
Here is a w3schools_css.sog 
<?xml version="1.0" encoding="UTF-8"?> 
 
<office:color-table xmlns:office="http://openoffice.org/2000/office" xmlns:style="http://openoffice.org/2000/style" xmlns:text="http://openoffice.org/2000/text" xmlns:table="http://openoffice.org/2000/table" xmlns:draw="http://openoffice.org/2000/drawing" xmlns:fo="http://www.w3.org/1999/XSL/Format" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:meta="http://openoffice.org/2000/meta" xmlns:number="http://openoffice.org/2000/datastyle" xmlns:svg="http://www.w3.org/2000/svg" xmlns:chart="http://openoffice.org/2000/chart" xmlns:dr3d="http://openoffice.org/2000/dr3d" xmlns:math="http://www.w3.org/1998/Math/MathML" xmlns:form="http://openoffice.org/2000/form" xmlns:script="http://openoffice.org/2000/script"> 
<draw:color draw:name="aliceblue (#F0F8FF)" draw:color="#F0F8FF"/> 
<draw:color draw:name="antiquewhite (#FAEBD7)" draw:color="#FAEBD7"/> 
<draw:color draw:name="aqua (#00FFFF)" draw:color="#00FFFF"/> 
<draw:color draw:name="aquamarine (#7FFFD4)" draw:color="#7FFFD4"/> 
<draw:color draw:name="azure (#F0FFFF)" draw:color="#F0FFFF"/> 
<draw:color draw:name="beige (#F5F5DC)" draw:color="#F5F5DC"/> 
<draw:color draw:name="bisque (#FFE4C4)" draw:color="#FFE4C4"/> 
<draw:color draw:name="black (#000000)" draw:color="#000000"/> 
<draw:color draw:name="blanchedalmond (#FFEBCD)" draw:color="#FFEBCD"/> 
<draw:color draw:name="blue (#0000FF)" draw:color="#0000FF"/> 
<draw:color draw:name="blueviolet (#8A2BE2)" draw:color="#8A2BE2"/> 
<draw:color draw:name="brown (#A52A2A)" draw:color="#A52A2A"/> 
<draw:color draw:name="burlywood (#DEB887)" draw:color="#DEB887"/> 
<draw:color draw:name="cadetblue (#5F9EA0)" draw:color="#5F9EA0"/> 
<draw:color draw:name="chartreuse (#7FFF00)" draw:color="#7FFF00"/> 
<draw:color draw:name="chocolate (#D2691E)" draw:color="#D2691E"/> 
<draw:color draw:name="coral (#FF7F50)" draw:color="#FF7F50"/> 
<draw:color draw:name="cornflowerblue (#6495ED)" draw:color="#6495ED"/> 
<draw:color draw:name="cornsilk (#FFF8DC)" draw:color="#FFF8DC"/> 
<draw:color draw:name="crimson (#DC143C)" draw:color="#DC143C"/> 
<draw:color draw:name="cyan (#00FFFF)" draw:color="#00FFFF"/> 
<draw:color draw:name="darkblue (#00008B)" draw:color="#00008B"/> 
<draw:color draw:name="darkcyan (#008B8B)" draw:color="#008B8B"/> 
<draw:color draw:name="darkgoldenrod (#B8860B)" draw:color="#B8860B"/> 
<draw:color draw:name="darkgray (#A9A9A9)" draw:color="#A9A9A9"/> 
<draw:color draw:name="darkgrey (#A9A9A9)" draw:color="#A9A9A9"/> 
<draw:color draw:name="darkgreen (#006400)" draw:color="#006400"/> 
<draw:color draw:name="darkkhaki (#BDB76B)" draw:color="#BDB76B"/> 
<draw:color draw:name="darkmagenta (#8B008B)" draw:color="#8B008B"/> 
<draw:color draw:name="darkolivegreen (#556B2F)" draw:color="#556B2F"/> 
<draw:color draw:name="darkorange (#FF8C00)" draw:color="#FF8C00"/> 
<draw:color draw:name="darkorchid (#9932CC)" draw:color="#9932CC"/> 
<draw:color draw:name="darkred (#8B0000)" draw:color="#8B0000"/> 
<draw:color draw:name="darksalmon (#E9967A)" draw:color="#E9967A"/> 
<draw:color draw:name="darkseagreen (#8FBC8F)" draw:color="#8FBC8F"/> 
<draw:color draw:name="darkslateblue (#483D8B)" draw:color="#483D8B"/> 
<draw:color draw:name="darkslategray (#2F4F4F)" draw:color="#2F4F4F"/> 
<draw:color draw:name="darkslategrey (#2F4F4F)" draw:color="#2F4F4F"/> 
<draw:color draw:name="darkturquoise (#00CED1)" draw:color="#00CED1"/> 
<draw:color draw:name="darkviolet (#9400D3)" draw:color="#9400D3"/> 
<draw:color draw:name="deeppink (#FF1493)" draw:color="#FF1493"/> 
<draw:color draw:name="deepskyblue (#00BFFF)" draw:color="#00BFFF"/> 
<draw:color draw:name="dimgray (#696969)" draw:color="#696969"/> 
<draw:color draw:name="dimgrey (#696969)" draw:color="#696969"/> 
<draw:color draw:name="dodgerblue (#1E90FF)" draw:color="#1E90FF"/> 
<draw:color draw:name="firebrick (#B22222)" draw:color="#B22222"/> 
<draw:color draw:name="floralwhite (#FFFAF0)" draw:color="#FFFAF0"/> 
<draw:color draw:name="forestgreen (#228B22)" draw:color="#228B22"/> 
<draw:color draw:name="fuchsia (#FF00FF)" draw:color="#FF00FF"/> 
<draw:color draw:name="gainsboro (#DCDCDC)" draw:color="#DCDCDC"/> 
<draw:color draw:name="ghostwhite (#F8F8FF)" draw:color="#F8F8FF"/> 
<draw:color draw:name="gold (#FFD700)" draw:color="#FFD700"/> 
<draw:color draw:name="goldenrod (#DAA520)" draw:color="#DAA520"/> 
<draw:color draw:name="gray (#808080)" draw:color="#808080"/> 
<draw:color draw:name="grey (#808080)" draw:color="#808080"/> 
<draw:color draw:name="green (#008000)" draw:color="#008000"/> 
<draw:color draw:name="greenyellow (#ADFF2F)" draw:color="#ADFF2F"/> 
<draw:color draw:name="honeydew (#F0FFF0)" draw:color="#F0FFF0"/> 
<draw:color draw:name="hotpink (#FF69B4)" draw:color="#FF69B4"/> 
<draw:color draw:name="indianred (#CD5C5C)" draw:color="#CD5C5C"/> 
<draw:color draw:name="indigo (#4B0082)" draw:color="#4B0082"/> 
<draw:color draw:name="ivory (#FFFFF0)" draw:color="#FFFFF0"/> 
<draw:color draw:name="khaki (#F0E68C)" draw:color="#F0E68C"/> 
<draw:color draw:name="lavender (#E6E6FA)" draw:color="#E6E6FA"/> 
<draw:color draw:name="lavenderblush (#FFF0F5)" draw:color="#FFF0F5"/> 
<draw:color draw:name="lawngreen (#7CFC00)" draw:color="#7CFC00"/> 
<draw:color draw:name="lemonchiffon (#FFFACD)" draw:color="#FFFACD"/> 
<draw:color draw:name="lightblue (#ADD8E6)" draw:color="#ADD8E6"/> 
<draw:color draw:name="lightcoral (#F08080)" draw:color="#F08080"/> 
<draw:color draw:name="lightcyan (#E0FFFF)" draw:color="#E0FFFF"/> 
<draw:color draw:name="lightgoldenrodyellow (#FAFAD2)" draw:color="#FAFAD2"/> 
<draw:color draw:name="lightgray (#D3D3D3)" draw:color="#D3D3D3"/> 
<draw:color draw:name="lightgrey (#D3D3D3)" draw:color="#D3D3D3"/> 
<draw:color draw:name="lightgreen (#90EE90)" draw:color="#90EE90"/> 
<draw:color draw:name="lightpink (#FFB6C1)" draw:color="#FFB6C1"/> 
<draw:color draw:name="lightsalmon (#FFA07A)" draw:color="#FFA07A"/> 
<draw:color draw:name="lightseagreen (#20B2AA)" draw:color="#20B2AA"/> 
<draw:color draw:name="lightskyblue (#87CEFA)" draw:color="#87CEFA"/> 
<draw:color draw:name="lightslategray (#778899)" draw:color="#778899"/> 
<draw:color draw:name="lightslategrey (#778899)" draw:color="#778899"/> 
<draw:color draw:name="lightsteelblue (#B0C4DE)" draw:color="#B0C4DE"/> 
<draw:color draw:name="lightyellow (#FFFFE0)" draw:color="#FFFFE0"/> 
<draw:color draw:name="lime (#00FF00)" draw:color="#00FF00"/> 
<draw:color draw:name="limegreen (#32CD32)" draw:color="#32CD32"/> 
<draw:color draw:name="linen (#FAF0E6)" draw:color="#FAF0E6"/> 
<draw:color draw:name="magenta (#FF00FF)" draw:color="#FF00FF"/> 
<draw:color draw:name="maroon (#800000)" draw:color="#800000"/> 
<draw:color draw:name="mediumaquamarine (#66CDAA)" draw:color="#66CDAA"/> 
<draw:color draw:name="mediumblue (#0000CD)" draw:color="#0000CD"/> 
<draw:color draw:name="mediumorchid (#BA55D3)" draw:color="#BA55D3"/> 
<draw:color draw:name="mediumpurple (#9370D8)" draw:color="#9370D8"/> 
<draw:color draw:name="mediumseagreen (#3CB371)" draw:color="#3CB371"/> 
<draw:color draw:name="mediumslateblue (#7B68EE)" draw:color="#7B68EE"/> 
<draw:color draw:name="mediumspringgreen (#00FA9A)" draw:color="#00FA9A"/> 
<draw:color draw:name="mediumturquoise (#48D1CC)" draw:color="#48D1CC"/> 
<draw:color draw:name="mediumvioletred (#C71585)" draw:color="#C71585"/> 
<draw:color draw:name="midnightblue (#191970)" draw:color="#191970"/> 
<draw:color draw:name="mintcream (#F5FFFA)" draw:color="#F5FFFA"/> 
<draw:color draw:name="mistyrose (#FFE4E1)" draw:color="#FFE4E1"/> 
<draw:color draw:name="moccasin (#FFE4B5)" draw:color="#FFE4B5"/> 
<draw:color draw:name="navajowhite (#FFDEAD)" draw:color="#FFDEAD"/> 
<draw:color draw:name="navy (#000080)" draw:color="#000080"/> 
<draw:color draw:name="oldlace (#FDF5E6)" draw:color="#FDF5E6"/> 
<draw:color draw:name="olive (#808000)" draw:color="#808000"/> 
<draw:color draw:name="olivedrab (#6B8E23)" draw:color="#6B8E23"/> 
<draw:color draw:name="orange (#FFA500)" draw:color="#FFA500"/> 
<draw:color draw:name="orangered (#FF4500)" draw:color="#FF4500"/> 
<draw:color draw:name="orchid (#DA70D6)" draw:color="#DA70D6"/> 
<draw:color draw:name="palegoldenrod (#EEE8AA)" draw:color="#EEE8AA"/> 
<draw:color draw:name="palegreen (#98FB98)" draw:color="#98FB98"/> 
<draw:color draw:name="paleturquoise (#AFEEEE)" draw:color="#AFEEEE"/> 
<draw:color draw:name="palevioletred (#D87093)" draw:color="#D87093"/> 
<draw:color draw:name="papayawhip (#FFEFD5)" draw:color="#FFEFD5"/> 
<draw:color draw:name="peachpuff (#FFDAB9)" draw:color="#FFDAB9"/> 
<draw:color draw:name="peru (#CD853F)" draw:color="#CD853F"/> 
<draw:color draw:name="pink (#FFC0CB)" draw:color="#FFC0CB"/> 
<draw:color draw:name="plum (#DDA0DD)" draw:color="#DDA0DD"/> 
<draw:color draw:name="powderblue (#B0E0E6)" draw:color="#B0E0E6"/> 
<draw:color draw:name="purple (#800080)" draw:color="#800080"/> 
<draw:color draw:name="red (#FF0000)" draw:color="#FF0000"/> 
<draw:color draw:name="rosybrown (#BC8F8F)" draw:color="#BC8F8F"/> 
<draw:color draw:name="royalblue (#4169E1)" draw:color="#4169E1"/> 
<draw:color draw:name="saddlebrown (#8B4513)" draw:color="#8B4513"/> 
<draw:color draw:name="salmon (#FA8072)" draw:color="#FA8072"/> 
<draw:color draw:name="sandybrown (#F4A460)" draw:color="#F4A460"/> 
<draw:color draw:name="seagreen (#2E8B57)" draw:color="#2E8B57"/> 
<draw:color draw:name="seashell (#FFF5EE)" draw:color="#FFF5EE"/> 
<draw:color draw:name="sienna (#A0522D)" draw:color="#A0522D"/> 
<draw:color draw:name="silver (#C0C0C0)" draw:color="#C0C0C0"/> 
<draw:color draw:name="skyblue (#87CEEB)" draw:color="#87CEEB"/> 
<draw:color draw:name="slateblue (#6A5ACD)" draw:color="#6A5ACD"/> 
<draw:color draw:name="slategray (#708090)" draw:color="#708090"/> 
<draw:color draw:name="slategrey (#708090)" draw:color="#708090"/> 
<draw:color draw:name="snow (#FFFAFA)" draw:color="#FFFAFA"/> 
<draw:color draw:name="springgreen (#00FF7F)" draw:color="#00FF7F"/> 
<draw:color draw:name="steelblue (#4682B4)" draw:color="#4682B4"/> 
<draw:color draw:name="tan (#D2B48C)" draw:color="#D2B48C"/> 
<draw:color draw:name="teal (#008080)" draw:color="#008080"/> 
<draw:color draw:name="thistle (#D8BFD8)" draw:color="#D8BFD8"/> 
<draw:color draw:name="tomato (#FF6347)" draw:color="#FF6347"/> 
<draw:color draw:name="turquoise (#40E0D0)" draw:color="#40E0D0"/> 
<draw:color draw:name="violet (#EE82EE)" draw:color="#EE82EE"/> 
<draw:color draw:name="wheat (#F5DEB3)" draw:color="#F5DEB3"/> 
<draw:color draw:name="white (#FFFFFF)" draw:color="#FFFFFF"/> 
<draw:color draw:name="whitesmoke (#F5F5F5)" draw:color="#F5F5F5"/> 
<draw:color draw:name="yellow (#FFFF00)" draw:color="#FFFF00"/> 
<draw:color draw:name="yellowgreen (#9ACD32)" draw:color="#9ACD32"/> 
</office:color-table>
Posted @ Sunday, August 10, 2014 2:54 PM by Jim Blake
Post Comment
Name
 *
Email
 *
Website (optional)
Comment
 *

Allowed tags: <a> link, <b> bold, <i> italics