Forget about #RGB codes... Introducing TiddlyTools' PaletteMaker!

[Eric Shulman]

I hate typing in #RGB codes to create/modify the ColorPalette slices
definitions

Although I know many RGB color codes from memory, without being able
to *see* the colors I am choosing, it's really hard to judge if they
will look right, without saving the ColorPalette changes and testing
to see the actual color 'in situ'. Then, if just one color is off by
a little bit, you have to go back to edit the ColorPalette
definitions, then test again, etc. until you get it the way you like.

Well... no more.... now there's
http://www.TiddlyTools.com/#PaletteMaker

Just add this *transclusion* tiddler to your document and you can use
an interactive "color grid" and listbox to edit the ColorPalette
entries (and/or create new ones), without ever having to actually get
your fingertips all stained by mixing those ugly RGB codes by
hand! :-)

... and, you can even embed "<<tiddler PaletteMaker>>" in the
ColorPalette itself. With some minor style formatting you can show
the ColorPalette slice definitions (e.g., "Background: #fff") *and*
the interactive color grid/list side-by-side, like this:
http://www.TiddlyTools.com/#ColorPalette

enjoy,
-e
Eric Shulman
TiddlyTools / ELS Design Studios

[wolfgang]

> Well... no more.... now there's
> http://www.TiddlyTools.com/#PaletteMaker
>

Thanks Eric, for this new tool helping in working out new palettes.

By the way, what's the difference between the default 216-color 'web
safe' colors and any other?
In using any color I never came across an apparent difference.

Though PaletteMaker already now comes with many features, I thought of
one additional one to enable quick inclusion of other StyleSheet
relevant values, for example background pictures, as implemented here:
http://mwanz.tiddlyspot.com/#ColorPalette

This would allow quick adjustments to other display elements too, as
Fred tried it here:
http://devpad.tiddlyspot.com/#EasyLayoutPlugin

Regards..

[Måns]

Thanks a lot Eric!!
This is surely a tool which makes life easier - especially for someone
who *doesn't* remember colourcodes at all..

YS Måns Mårtensson

[Eric Shulman]

> >  http://www.TiddlyTools.com/#PaletteMaker

> By the way, what's the difference between the default 216-color 'web
> safe' colors and any other?

The PaletteMaker documentation now includes a Wikipedia link to
information about the 'web safe' palette. Summary: it's a historical
artifact left over from 8-bit graphics days, when 255 "mapped color"
graphics were common. However, it still offers a decent set of 216
RGB combinations plus 16 grays and 14 'rainbow' colors (ROYGBIV -
light and dark), for a total of 248 color choices.

> Though PaletteMaker already now comes with many features, I thought of
> one additional one to enable quick inclusion of other StyleSheet
> relevant values, for example background pictures, as implemented here:http://mwanz.tiddlyspot.com/#ColorPalette

PaletteMaker has been updated. It now supports an 'allowOther' option
that permits you to use *non-color CSS values* such as "url(...)".
When entering non-color values with 'allowOther' enabled, you will get
a second message asking to confirm the entry because it is "not a
recognized color value". If 'allowOther' is not enabled, the non-
color input value will be rejected. You can also include non-color
values in the color grid definition, so you can select and assign
those values to 'color' names with a single-click. If 'allowOther' is
not enabled, non-color grid values are simply displayed as regular
wiki-formatted cell content, without the grid's 'onclick' listbox
popup being added that cell.

enjoy,
-e

[wolfgang]

Thanks for explaining and adding this additional feature to
PaletteMaker!

Just discovered the new MissingTiddlersPlugin on your site:
http://www.tiddlytools.com/#MissingTiddlersPlugin

However, from the Documentation it's not that clear how it could be
use for redirecting to an alternative existing tiddler. Though in the
usage section it describes using: <<missingTiddler [[title]] [[list]]
[[fallback]]>>, however I can't find a working example of this macro,
but the [[MissingTiddlersList]] instead, where an altenative message
could be defined.

How would it be possible to also create redirects to existing
tiddlers?
Would it work to redirect to an alternative existing tiddler by
placing above macro into MissingTiddlersList under a heading?

For example:

!NoMoreExistingTiddler
<<missingTiddler [[NoMoreExistingTiddler]]
"" [[AlternativeExistingTiddler]]>>

Regards..

[Alex Hough]

great work Eric

Alex

2009/10/11 wolfgang <wolfga...@gmail.com>

--
http://www.multiurl.com/g/64

[distracted1]

<<tiddler ThunderingAppluase with: "thanks">>

another feather.

[HansWobbe]

On Oct 10, 5:05 am, Eric Shulman <elsdes...@gmail.com> wrote:
> ...

> Well... no more.... now there's
>  http://www.TiddlyTools.com/#PaletteMaker

> ...

> enjoy,
> -e
> Eric Shulman
> TiddlyTools / ELS Design Studios

Excellent!! What a great productivity aid. Thank you very much, Eric!

[sonomakid2002]

Eric,
I am new at the WIKI, I understand the basic formatting, but I am
trying to understand the style, formatting and colorpalette, and I am
having difficulty getting the color palette added or set up. Can you
please help?
Cody

On Oct 10, 4:05 am, Eric Shulman <elsdes...@gmail.com> wrote:
> I hate typing in #RGB codes to create/modify the ColorPalette slices
> definitions
>

> Although I know many RGBcolorcodes from memory, without being able

> to *see* the colors I am choosing, it's really hard to judge if they
> will look right, without saving the ColorPalette changes and testing

> to see the actualcolor'in situ'.  Then, if just onecoloris off by

> a little bit, you have to go back to edit the ColorPalette
> definitions, then test again, etc. until you get it the way you like.
>
> Well... no more.... now there's
>  http://www.TiddlyTools.com/#PaletteMaker
>
> Just add this *transclusion* tiddler to your document and you can use

> an interactive "colorgrid" and listbox to edit the ColorPalette

> entries (and/or create new ones), without ever having to actually get
> your fingertips all stained by mixing those ugly RGB codes by
> hand! :-)
>
> ... and, you can even embed "<<tiddler PaletteMaker>>" in the
> ColorPalette itself.  With some minor style formatting you can show
> the ColorPalette slice definitions (e.g., "Background: #fff") *and*

> the interactivecolorgrid/list side-by-side, like this:

[Eric Shulman]

> I am new at the WIKI, I understand the basic formatting, but I am
> trying to understand the style, formatting and colorpalette, and I am
> having difficulty getting the color palette added or set up. Can you
> please help?

The ColorPalette tiddler is a built-in default ("shadow tiddler").

It contains a set of "slices" that define name/value pairs, like this:

Background: #fff
Foreground: #000
PrimaryPale: #8cf
PrimaryLight: #18f
PrimaryMid: #04b
PrimaryDark: #014
SecondaryPale: #ffc
SecondaryLight: #fe8
SecondaryMid: #db4
SecondaryDark: #841
TertiaryPale: #eee
TertiaryLight: #ccc
TertiaryMid: #999
TertiaryDark: #666
Error: #f88

These 'color names' are then used in the built-in default CSS rules
contained in StyleSheetColors, like this:
body {
background:[[ColorPalette::Background]];
color:[[ColorPalette::Foreground]];
}

The "[[TiddlerName::slicename]]" syntax is automatically replaced by
the value of the referenced slice before the CSS is passed to the
browser for processing. Thus, the above rule, as applied, is:
body {background:#fff; color:#000;}

You can customize the content of the default ColorPalette to suit your
preferences. Simply edit the tiddler (accessible via the
"more>shadowed" tab in the sidebar), and type in new slice definitions
or change the values of existing ones. Then, after pressing "done", a
*real* ColorPalette tiddler will be created, superseding the default
shadow content.

Of course, hand-editing the #RGB values in the ColorPalette tiddler
isn't very convenient... and that's where PaletteMaker comes in...

Just import a copy of the PaletteMaker tiddler from:
http://www.TiddlyTools.com/#PaletteMaker
then, you can use the live 'color grid' shown in the PaletteMaker
Examples to change/add values to the ColorPalette without ever needing
to hand-edit that tiddler.

You can also import my TiddlyTools-customized ColorPalette:
http://www.TiddlyTools.com/#ColorPalette
which includes an embedded color grid along side the actual color
palette slice definitions. Note: the layout for this tiddler uses
some CSS wrappers to apply formatting 'shortcuts' (such as 'floatleft'
and 'borderright'), which you can import from:
http://www.TiddlyTools.com/#StyleSheetShortcuts
Once imported, you will need to add:
[[StyleSheetShortcuts]]
to the bottom of your custom StyleSheet, so that the extra shortcut
definitions will be automatically included in the CSS passed to the
browser.

So... import the above three tiddlers, and add the one line to
StyleSheet, and you should be all set.

[sonomakid2002]

Thanks Eric.