Gentle color transitions / gradients with random color changes...

[Youkai1977]

... is this possible without much effort?

I have copied from the forum here following for my use... -> https://forum.rainmeter.net/viewtopic.php?p=78979#p78979 (Posting 2 from jsmorley)

...and modified as follows:

Code: Select all

[Rainmeter]
Update=500
DefaultUpdateDivider=2
AccurateText=1

[Metadata]
Name=Visualizer Demo (Visualizer Standby)
Author=Youkai1977
Version=V1.0 <> 19.11.2019
Information=This Meter is a Part of M.A.R.S.-Skin Package
License=Creative Commons BY-NC-SA 3.0

;--------------------------------------------------
;--- VARIABLES & STYLES ---------------------------
;--------------------------------------------------

[Variables]
Images=#@#images\
ImgAlpha=230
RGBColor1=[MeasureRed],[MeasureGreen],[MeasureBlue],100
RGBColor2=[MeasureBlue],[MeasureGreen],[MeasureRed],180
FS=15
Text1=M.A.R.S. TERMINAL V2.2
Text2=
Text3=

[Style]
FontColor=#RGBColor2#
FontFace=UBUNTU
StringAlign=LEFT
FontWeight=600
AntiAlias=1

;--------------------------------------------------
;--- MEASURES -------------------------------------
;--------------------------------------------------

[MeasureRed]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=16
HighBound=32

[MeasureGreen]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=32
HighBound=64

[MeasureBlue]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=64
HighBound=128

[mGraphicDemo]
Measure=CALC
Formula=Counter % 10
IfAboveValue=5
IfAboveAction=[!ShowMeter TEXT_1][!Redraw]
IfBelowValue=9
IfBelowAction=[!HideMeter TEXT_1][!Redraw]
UpdateDivider=1

;--------------------------------------------------
;--- BACKGROUND -----------------------------------
;--------------------------------------------------

[Background]
Meter=IMAGE
SolidColor=#RGBColor1#
X=0
Y=0
W=564
H=80
DynamicVariables=1

;--------------------------------------------------
;--- VISUALIZER DEMO METERS -----------------------
;--------------------------------------------------

[GraphicDemo]
Meter=BITMAP
MeasureName=mGraphicDemo
BitmapImage=#Images#vis_demo.png
BitmapFrames=10
BitmapExtend=1
AntiAlias=1
X=r
Y=r
UpdateDivider=1

[TEXT_1]
Meter=STRING
FontSize=#FS#
MeterStyle=Style
Text=#Text1#
X=165
Y=28
Hidden=1
DynamicVariables=1

;---------------------------------------------------
;--- VISUALIZER DEMO FRAME -------------------------
;---------------------------------------------------

[VisualizerFrame]
Meter=IMAGE
ImageName=#Images#visualizer_frame.png
ImageAlpha=#ImgAlpha#
Antialias=1
X=0
Y=0
W=564
H=80
UpdateDivider=-1

It works really well, much better than what I had designed before (color code calculation by% H% M% S ... so time).
Was also interesting, but somehow ... well ...
Also, I'm here in the forum already encountered in various ways how to generate a random color change. But no one offers a gentle color gradient.

Therefore, I would like to know if something like that is possible without writing a * .lua file now, or any other additional plug-ins, or if you can change jsmorley's code to overflow the colors, instead of abruptly every second switch.

As usual with me ... Spelling mistakes is the fault of the aunt Google Translator ...
Greez Youkai1977

[balala]

In the above code the values of the [MeasureRed], [MeasureGreen] and [MeasureBlue] measures are changing randomly. For a much more gentle color change you have to take care not to change the values of the measures so quickly. To achieve this you'll need two additional sets of measures, plus a variable. Here is the updated code:

Code: Select all

[Rainmeter]
Update=1000

[Variables]
RGB=1
Step=30

[MeasureFirstUpdate]
Measure=Calc
Formula=( MeasureFirstUpdate + 1 )
OnChangeAction=[!SetVariable RGB "0"][!UpdateMeasureGroup "RGB"][!DisableMeasure "#CURRENTSECTION#"]

[MeasureRed]
Measure=Calc
Formula=Random
UpdateRandom=0
LowBound=0
HighBound=255

[MeasureGreen]
Measure=Calc
Formula=Random
UpdateRandom=0
LowBound=0
HighBound=255

[MeasureBlue]
Measure=Calc
Formula=Random
UpdateRandom=0
LowBound=0
HighBound=255

[MeasureRedOffset]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=-#Step#
HighBound=#Step#

[MeasureGreenOffset]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=-#Step#
HighBound=#Step#

[MeasureBlueOffset]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=-#Step#
HighBound=#Step#

[MeasureRedVal]
Measure=Calc
Formula=( Clamp (( MeasureRedVal + #RGB# * MeasureRed + MeasureRedOffset ), 0, 255 ))
DynamicVariables=1
Group=RGB

[MeasureGreenVal]
Measure=Calc
Formula=( Clamp (( MeasureGreenVal + #RGB# * MeasureGreen + MeasureGreenOffset ), 0, 255 ))
DynamicVariables=1
Group=RGB

[MeasureBlueVal]
Measure=Calc
Formula=( Clamp (( MeasureBlueVal + #RGB# * MeasureBlue + MeasureBlueOffset ), 0, 255 ))
DynamicVariables=1
Group=RGB

[MeasureHourMinute]
Measure=Time
Format=%#I:%M

[MeasureSecond]
Measure=Time
Format=%S

[MeterHourMinute]
Meter=String
MeasureName=MeasureHourMinute
FontFace=Arial
FontSize=70
FontColor=255,255,255,255
StringStyle=Bold
Antialias=1
Text=%1:

[MeterSecond]
Meter=String
MeasureName=MeasureSecond
X=-27R
FontFace=Arial
FontSize=70
FontColor=[MeasureRedVal],[MeasureGreenVal],[MeasureBlueVal],255
StringStyle=Bold
Antialias=1
DynamicVariables=1

Note the newly added measures ([MeasureRedOffset], [MeasureGreenOffset], [MeasureBlueOffset], [MeasureRedVal], [MeasureGreenVal] and [MeasureBlueVal]), the modified measures ([MeasureRed], [MeasureGreen] and [MeasureBlue]) and the variables (RGB and Step). Step is the largest possible variation of the colors. This means that if Step is set to 30 (as in the above code) and if for instance at the beginning the Red is set to 120 (by the [MeasureRed] measure) on next step its value is kept between 120 - 30 = 90 and 120 + 30 = 150. Smaller variations are possible, larger ones are not. The lower you set the value of the Step variable, the more gentle color change you'll see from one update to the other.

GIF.gif

[Youkai1977]

Thank you, yes that's the thing I'm looking for relatively close. Have your code now times in my meter maintained and changed as follows ...

Code: Select all

[Rainmeter]
Update=500
DefaultUpdateDivider=2
AccurateText=1

[Metadata]
Name=Visualizer Demo (Visualizer Standby)
Author=Youkai1977
Version=V1.0 (W.I.P) <> 19.11.2019
Information=This Meter is a Part of M.A.R.S.-Skin Package
License=Creative Commons BY-NC-SA 3.0

;--------------------------------------------------
;--- VARIABLES & STYLES ---------------------------
;--------------------------------------------------

[Variables]
Images=#@#images\
ImgAlpha=230
RGBColor1=[MeasureRedVal],[MeasureGreenVal],[MeasureBlueVal],100
RGBColor2=[MeasureBlueVal],[MeasureGreen],[MeasureRedVal],180
RGB=1
Step=4
FS=15
Text1=M.A.R.S. TERMINAL V2.2
Text2=
Text3=

[Style]
FontColor=#RGBColor2#
FontFace=UBUNTU
StringAlign=LEFT
FontWeight=600
AntiAlias=1

;--------------------------------------------------
;--- MEASURES -------------------------------------
;--------------------------------------------------

;--- MEASURE(S) RANDOM COLORS FOR BG & TEXT -------

[MeasureFirstUpdate]
Measure=Calc
Formula=( MeasureFirstUpdate + 1 )
OnChangeAction=[!SetVariable RGB "0"][!UpdateMeasureGroup "RGB"][!DisableMeasure "#CURRENTSECTION#"]

[MeasureRed]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=16
HighBound=32

[MeasureGreen]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=32
HighBound=64

[MeasureBlue]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=64
HighBound=128

[MeasureRedOffset]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=-#Step#
HighBound=#Step#

[MeasureGreenOffset]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=-#Step#
HighBound=#Step#

[MeasureBlueOffset]
Measure=Calc
Formula=Random
UpdateRandom=1
LowBound=-#Step#
HighBound=#Step#

[MeasureRedVal]
Measure=Calc
Formula=( Clamp (( MeasureRedVal + #RGB# * MeasureRed + MeasureRedOffset ), 0, 255 ))
DynamicVariables=1
Group=RGB

[MeasureGreenVal]
Measure=Calc
Formula=( Clamp (( MeasureGreenVal + #RGB# * MeasureGreen + MeasureGreenOffset ), 0, 255 ))
DynamicVariables=1
Group=RGB

[MeasureBlueVal]
Measure=Calc
Formula=( Clamp (( MeasureBlueVal + #RGB# * MeasureBlue + MeasureBlueOffset ), 0, 255 ))
DynamicVariables=1
Group=RGB

;--- MEASURE(S) DEMO CHANGER ----------------------

[MeasureDEMO_1_2]
Measure=Time
Format=%S
IfBelowValue=30
IfBelowAction=[!EnableMeasure mGraphicDemo][!ShowMeterGroup DEMO_1"][!Redraw]
IfEqualValue=30
IfEqualAction=[!DisableMeasure mGraphicDemo][!HideMeterGroup DEMO_1"][!Redraw]

;--- MEASURE(S) DEMO 1 ----------------------------

[mGraphicDemo]
Measure=CALC
Formula=Counter % 10
IfAboveValue=5
IfAboveAction=[!ShowMeter TEXT_1][!Redraw]
IfBelowValue=9
IfBelowAction=[!HideMeter TEXT_1][!Redraw]
UpdateDivider=1

;--------------------------------------------------
;--- BACKGROUND -----------------------------------
;--------------------------------------------------

[Background]
Meter=IMAGE
SolidColor=#RGBColor1#
X=0
Y=0
W=564
H=80
DynamicVariables=1

;--------------------------------------------------
;--- VISUALIZER DEMO METERS -----------------------
;--------------------------------------------------

;--- DEMO 1 ---------------------------------------

[GraphicDemo]
Meter=BITMAP
MeasureName=mGraphicDemo
BitmapImage=#Images#vis_demo.png
BitmapFrames=10
BitmapExtend=1
AntiAlias=1
X=r
Y=r
UpdateDivider=1
Group=DEMO_1

[TEXT_1]
Meter=STRING
FontSize=#FS#
MeterStyle=Style
FontColor=#RGBColor2#
Text=#Text1#
X=165
Y=28
Hidden=1
DynamicVariables=1
Group=DEMO_1

;---------------------------------------------------
;--- VISUALIZER DEMO FRAME -------------------------
;---------------------------------------------------

[VisualizerFrame]
Meter=IMAGE
ImageName=#Images#visualizer_frame.png
ImageAlpha=#ImgAlpha#
Antialias=1
X=0
Y=0
W=564
H=80
UpdateDivider=-1

...maybe I can now because of the fine adjustment on the UpdateDivider set (or I think there because of a mistake / to 100 corners).
However, yes, probably, because I just want to keep the UpdateDivider as normal as possible in this meter. Because the reason for this meter is the following ... see spoiler...

My RGB-Visualizer should be switched off when not in use and in its place as long as this DEMO-meter run. The background is that I still work with a relatively old CPU (4 cores), which goes down in my active RGB-Visualizer and an UpdateDivider of 32ms (0 or 16 not at all) ... at 32ms, 2x16 Tapes, plus 2x16 top tapes, as well as color changes to the beat of the music in the background and in the tapes, as my CPU expects dead and is up to 30% utilization and goes into the turbo (4.1GHz) as a continuous load. And since I only need the visualizer to listen to the music anyway, it should disable itself when I do other things on the PC to lower the CPU. I've already programmed that in my skin and already runs well. So this thread is not topic here.

In that sense, thanks again. But I'm still happy for more "softer" ideas for color transitions open
LG Youkai1977

[balala]

Thank you, yes that's the thing I'm looking for relatively close. Have your code now times in my meter maintained and changed as follows ...

...maybe I can now because of the fine adjustment on the UpdateDivider set (or I think there because of a mistake / to 100 corners).
However, yes, probably, because I just want to keep the UpdateDivider as normal as possible in this meter. Because the reason for this meter is the following ...

To be honest I'm not very sure if there still are issues. I suppose there are not, but I'm not sure. Are they?

[Youkai1977]

To be honest I'm not very sure if there still are issues. I suppose there are not, but I'm not sure. Are they?

Based on my question about a gentle color transition, everything is fine. Unless someone has another suggestion / idea. The other I had just mentioned or posted pictures. But has nothing to do with my question.

In this sense ... thanks again

[balala]

Based on my question about a gentle color transition, everything is fine. Unless someone has another suggestion / idea.

Well, ok. I'm glad if I helped.

[eclectic-tech]

Based on my question about a gentle color transition, everything is fine. Unless someone has another suggestion / idea.

You might be interested in BlendColor.lua, a script by HakShak that can smoothly transition RGB colors, and ALPHA, based on any measure percentage changes.

A copy of his lua code (BlendColor.lua) for quick reference

Code: Select all

-- BlendColor is a LUA script for processing multiple color scales to output
-- RGBA notation within Rainmeter INIs.

--Each scale is composed of "Start Percentrage, End Percentage, Start Color Value, End Color Value" notation
--e.g.: Fade a color in gradually over 100% would be "0,100,0,255"

--You can add more scales via a pipe '|' delimiter
--The below examples are the equivalent of "0,100,0,255"
--"0,50,0,128|50,100,128,255"
--"0,25,0,64|25,50,64,128|75,50,128,192|75,100,192,255"

--There is no limit to how many scales provided per option
--Only RedScale, BlueScale, GreenScale, and AlphaScale options are available.

--The measure fed to the script must have a MinValue and MaxValue set as it is based on percentages.

--Scales support variables, however, scales are only evaluated at startup.
--So dynamic variables will not be updated. (This support could be added, but doesn't make practical sense.)

--The below example will keep the color green until 50%, then fade green down to 0 from 50% to 75%.
--It also fades red in starting at 50% and makes sure it's full red from 75% to 100%
--It also keeps the alpha level at 64 from 0-50%, then fades more in from 50-100%

--[ExampleColorMeasure]
--Measure=Script
--ScriptFile=BlendColor.lua
--MeasureToBlend=SomeMeasureWithMinMaxSet
--RedScale=50,75,0,255|75,100,255,255
--GreenScale=0,50,255,255|50,75,255,0
--AlphaScale=0,50,64,64|50,100,64,255

--Using this measure is as simple as:
--LineColor=[ExampleColorMeasure]


function Initialize()
	RedScale = load_scales('RedScale')
	GreenScale = load_scales('GreenScale')
	BlueScale = load_scales('BlueScale')
	AlphaScale = load_scales('AlphaScale')
end

function Update()
	local inputMeterName = SELF:GetOption('MeasureToBlend')
	local inputMeter = SKIN:GetMeasure(inputMeterName)
	local meterValue = inputMeter:GetRelativeValue() * 100

    local red = multi_scale_color(meterValue, RedScale)
    local green = multi_scale_color(meterValue, GreenScale)
    local blue = multi_scale_color(meterValue, BlueScale)
    local alpha = multi_scale_color(meterValue, AlphaScale)
    
    --Simplify since Color::MakeARGB doesn't really care about decimals
    --Also makes printing these less painful to look at
    red = math.floor(red + 0.5)
    green = math.floor(green + 0.5)
    blue = math.floor(blue + 0.5)
    alpha = math.floor(alpha + 0.5)

     local result = red .. ',' .. green .. ',' .. blue .. ',' .. alpha

	return result
end

function load_scales(scaleOption)
	local scaleString = SELF:GetOption(scaleOption)
	scalestring = SKIN:ReplaceVariables(scaleString)
	local result = {}
	for i in string.gmatch(scaleString, "([^|]+)") do
		local scale = {}
		for x in string.gmatch(i, "([^,]+)") do
			local number = tonumber(x)
			if number == nil then
				disable_me()
				error('Value in ' .. scaleOption .. ' option is not a number. Expecting number within group "' .. i .. '" at "' .. x .. '"')
			end

			table.insert(scale, number)
		end
		table.insert(result, scale)
	end

	return result
end

function scale(value, oldMin, oldMax, newMin, newMax)
	local oldRange = oldMax - oldMin
	local newRange = newMax - newMin
	local scaled = (((value - oldMin) * newRange) / oldRange) + newMin
	return scaled
end

--Expects lower percentage bound, upper percentage bound, lower color bound, upper color bound
function multi_scale_color(percentage, colorScaleTable)
	if type(colorScaleTable) ~= 'table' then
			disable_me()
			error('"' .. colorScaleTable .. '" is not a table.')
	end

	for i, value in ipairs(colorScaleTable) do
		if type(value) ~= 'table' then
			disable_me()
			error('Value (' .. value ..') at key ' .. i .. ' is not a table.')
		end

		if table.getn(value) ~= 4 then
			disable_me()
			error('Four values are required in the table, key ' .. i .. ' has only ' .. table.getn(value) .. ' values.')
		end

		if percentage >= value[1] and percentage <= value[2] then
			return scale(percentage, value[1], value[2], value[3], value[4])
		end
	end

	--Nothing was found to do
	return 0
end

function disable_me()
	SELF:Disable()
	print('Disabling Measure: ' .. SELF:GetName())
end

[Youkai1977]

@eclectic-tech:

Thank you for this idea with the * .lua script
I'd like to test that, even if I would let external files out. But no matter, testing costs nothing and therefore I once started to rewrite my meter accordingly. However, I am an absolute NOOB in terms of lua-script. I'm glad that I understand that I roughly understand the Rainmeter commands and can distinguish one meter from a Measure. If then the language barrier for me to come (German <> English) then it turns off completely. In short, I have, so far as I understand it, built into my meter, but it does not work. Something I have definitely done wrong or forgot. Can you help me with that? Here is my rewritten meter code...

Code: Select all

[Rainmeter]
Update=500
DefaultUpdateDivider=2
AccurateText=1

[Metadata]
Name=Visualizer Demo (Visualizer Standby)
Author=Youkai1977
Version=V1.0 (W.I.P) <> 21.11.2019
Information=This Meter is a Part of M.A.R.S.-Skin Package
License=Creative Commons BY-NC-SA 3.0

;--------------------------------------------------
;--- VARIABLES & STYLES ---------------------------
;--------------------------------------------------

[Variables]
Images=#@#images\
ImgAlpha=230
RGBColor=[ExampleColorMeasure]
FontColor=164,164,164,180
FS=15
Text1=M.A.R.S. TERMINAL V2.2
Text2=
Text3=

[Style]
FontColor=#FontColor#
FontFace=UBUNTU
StringAlign=LEFT
FontWeight=600
AntiAlias=1

;--------------------------------------------------
;--- MEASURES -------------------------------------
;--------------------------------------------------

;--- MEASURE(S) RANDOM COLORS FOR BG & TEXT -------

[ExampleColorMeasure]
Measure=Script
ScriptFile=BlendColor.lua
MeasureToBlend=SomeMeasureWithMinMaxSet
RedScale=50,75,0,255|75,100,255,255
GreenScale=0,50,255,255|50,75,255,0
AlphaScale=0,50,64,64|50,100,64,255

;--- MEASURE(S) DEMO CHANGER ----------------------

[MeasureDEMO_1_2]
Measure=Time
Format=%S
IfBelowValue=30
IfBelowAction=[!EnableMeasure mGraphicDemo][!ShowMeterGroup DEMO_1"][!Redraw]
IfEqualValue=30
IfEqualAction=[!DisableMeasure mGraphicDemo][!HideMeterGroup DEMO_1"][!Redraw]

;--- MEASURE(S) DEMO 1 ----------------------------

[mGraphicDemo]
Measure=CALC
Formula=Counter % 10
IfAboveValue=5
IfAboveAction=[!ShowMeter TEXT_1][!Redraw]
IfBelowValue=9
IfBelowAction=[!HideMeter TEXT_1][!Redraw]
UpdateDivider=1

;--------------------------------------------------
;--- BACKGROUND -----------------------------------
;--------------------------------------------------

[Background]
Meter=IMAGE
SolidColor=#RGBColor#
X=0
Y=0
W=564
H=80
DynamicVariables=1

;--------------------------------------------------
;--- VISUALIZER DEMO METERS -----------------------
;--------------------------------------------------

;--- DEMO 1 ---------------------------------------

[GraphicDemo]
Meter=BITMAP
MeasureName=mGraphicDemo
BitmapImage=#Images#vis_demo.png
BitmapFrames=10
BitmapExtend=1
AntiAlias=1
X=r
Y=r
UpdateDivider=1
Group=DEMO_1

[TEXT_1]
Meter=STRING
MeterStyle=Style
FontSize=#FS#
Text=#Text1#
X=165
Y=28
Hidden=1
;DynamicVariables=1
Group=DEMO_1

;---------------------------------------------------
;--- VISUALIZER DEMO FRAME -------------------------
;---------------------------------------------------

[VisualizerFrame]
Meter=IMAGE
ImageName=#Images#visualizer_frame.png
ImageAlpha=#ImgAlpha#
Antialias=1
X=0
Y=0
W=564
H=80
UpdateDivider=-1

I think the mistake on my part is in the "SomeMeasureWithMinMaxSet". That's the part I did not quite understand in your short description. Am I correct with my fault diagnosis?

[jsmorley]

Colors are tricky to transition...

Just for reference going forward, here is my view of the mathematically "primary" colors.

Code: Select all

[Rainmeter]
Update=1000
DynamicWindowSize=1
AccurateText=1

[Variables]
White=255,255,255
Red=255,0,0
Orange=255,127,0
Yellow=255,255,0
Green=0,255,0
Cyan=0,255,255
Blue=0,127,255
Indigo=0,0,255
Violet=127,0,255
Magenta=255,0,255
Black=0,0,0

[MeterWhite]
Meter=Image
W=50
H=50
SolidColor=#White#

[MeterRed]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Red#

[MeterOrange]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Orange#

[MeterYellow]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Yellow#

[MeterGreen]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Green#

[MeterCyan]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Cyan#

[MeterBlue]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Blue#

[MeterIndigo]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Indigo#

[MeterViolet]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Violet#

[MeterMagenta]
Meter=Image
X=2R
W=50
H=50
SolidColor=#Magenta#

colors.png

colors2.png

The real trick in my view is that "Indigo" (what most people think of as "Blue" since it is 100% blue and nothing else) and "Violet" (Purple) are both reasonably "dark" colors in their primary state, particularly "Indigo", while the rest are reasonably "light". This makes transitioning difficult if you want to keep the same relative "visible brightness" as you transition.

Some colors that look great on a dark background are not pleasing at all on a light background, and visa versa...

On a dark background, you likely want to "lighten" Indigo more toward my Blue, and Violet more toward my Magenta, but you don't want to do that with colors like Red, that very quickly becomes "pink" if lightened.

Note as well that any "transition" from one color to the other must "go through" any intervening colors. So to transition from Red to Blue, you either have to go "forward" through Orange, Yellow, Green and Cyan, or "backward" through Magenta and Violet. No smooth transition can avoid this. Yellow is particularly difficult to go "through", as anything other than exactly Yellow tends toward "mud".




Search keys: Primary Colors Color Transition Indigo

[pul53dr1v3r]

probably the light ones from the table will be useful for a dark bg.: