It is currently February 16th, 2019, 2:16 am

Converting RGB color code to hexadecimal

Tips and Tricks from the Rainmeter Community
User avatar
balala
Rainmeter Sage
Posts: 7628
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Converting RGB color code to hexadecimal

balala » October 28th, 2017, 6:39 pm

After a discussion into this thread, I wrote a simple Rainmeter code, to convert an RGB color code, to hexadecimal. After getting it to work well, I thought it could be useful for more users, so finally I decided to post it here.

I know the Convert Colors section of the Rainmeter Snippets gives a way to do this conversion, but that is done with a small lua script. My solution avoids this, the conversion being done with Rainmeter code, without using a lua script.

If you want to try the code, you have to enter the color code which will be converted, as the DecColor variable. You can use either a code with, or one without Alpha component (so with three or with four components). The result will be accordingly, containing six or eight digits.

Is this code useful for you? Does it works well? Any comment would be welcomed.

Thanks.

The code:

Code: Select all

[Rainmeter]
Update=-1
BackgroundMode=2
SolidColor=0,0,0,1

[Variables]
DecColor=244,5,136,152

[MeasureComponents]
Measure=String
String=#DecColor#
RegExpSubstitute=1
Substitute="^(.*),(.*),(.*),(.*)$":"1","^(.*),(.*),(.*)$":"0"
IfCondition=([#CURRENTSECTION#]=0)
IfTrueAction=[!SetOption MeasureDigits String "[*MeasureDigitRed1*][*MeasureDigitRed2*][*MeasureDigitGreen1*][*MeasureDigitGreen2*][*MeasureDigitBlue1*][*MeasureDigitBlue2*]"][!UpdateMeasure "MeasureDigits"][!UpdateMeter "MeterColor"][!Redraw]
IfFalseAction=[!SetOption MeasureDigits String "[*MeasureDigitRed1*][*MeasureDigitRed2*][*MeasureDigitGreen1*][*MeasureDigitGreen2*][*MeasureDigitBlue1*][*MeasureDigitBlue2*][*MeasureDigitAlpha1*][*MeasureDigitAlpha2*]"][!UpdateMeasure "MeasureDigits"][!UpdateMeter "MeterColor"][!Redraw]
DynamicVariables=1

[MeasureRed]
Measure=String
String=#DecColor#
RegExpSubstitute=1
Substitute="^(\d{1,3}),(\d{1,3}),(\d{1,3})$":"\1","^(\d{1,3}),(\d{1,3}),(\d{1,3}),(\d{1,3})$":"\1"
Group=ColorComponents

[MeasureGreen]
Measure=String
String=#DecColor#
RegExpSubstitute=1
Substitute="^(\d{1,3}),(\d{1,3}),(\d{1,3})$":"\2","^(\d{1,3}),(\d{1,3}),(\d{1,3}),(\d{1,3})$":"\2"
Group=ColorComponents

[MeasureBlue]
Measure=String
String=#DecColor#
RegExpSubstitute=1
Substitute="^(\d{1,3}),(\d{1,3}),(\d{1,3})$":"\3","^(\d{1,3}),(\d{1,3}),(\d{1,3}),(\d{1,3})$":"\3"
Group=ColorComponents

[MeasureAlpha]
Measure=String
String=#DecColor#
RegExpSubstitute=1
Substitute="^(\d{1,3}),(\d{1,3}),(\d{1,3})$":"0","^(\d{1,3}),(\d{1,3}),(\d{1,3}),(\d{1,3})$":"\4"
Group=ColorComponents

[MeasureDigitRed2]
Measure=Calc
Formula=( [MeasureRed] % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Digits

[MeasureDigitRed1]
Measure=Calc
Formula=(( Floor ( [MeasureRed] / 16 )) % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Digits

[MeasureDigitGreen2]
Measure=Calc
Formula=( [MeasureGreen] % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Digits

[MeasureDigitGreen1]
Measure=Calc
Formula=(( Floor ( [MeasureGreen] / 16 )) % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Digits

[MeasureDigitBlue2]
Measure=Calc
Formula=( [MeasureBlue] % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Digits

[MeasureDigitBlue1]
Measure=Calc
Formula=(( Floor ( [MeasureBlue] / 16 )) % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Digits

[MeasureDigitAlpha2]
Measure=Calc
Formula=( [MeasureAlpha] % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Alpha

[MeasureDigitAlpha1]
Measure=Calc
Formula=(( Floor ( [MeasureAlpha] / 16 )) % 16 )
RegExpSubstitute=1
Substitute="^10$":"A","^11$":"B","^12$":"C","^13$":"D","^14$":"E","^15$":"F"
DynamicVariables=1
Group=Alpha

[MeasureDigits]
Measure=String
DynamicVariables=1
Group=Digits

[MeterColor]
Meter=STRING
MeasureName=MeasureDigits
X=0
Y=0
Padding=15,5,15,5
FontColor=#DecColor#
SolidColor=0,0,0,120
FontSize=18
FontFace=Segoe UI
StringStyle=BOLD
StringAlign=LEFT
AntiAlias=1
Text=RGB: #DecColor##CRLF#Hexa: %1
DynamicVariables=1
User avatar
eclectic-tech
Rainmeter Sage
Posts: 3197
Joined: April 12th, 2012, 9:40 pm
Location: Cedar Point, Ohio, USA

Re: Converting RGB color code to hexadecimal

eclectic-tech » October 28th, 2017, 9:13 pm

Nice work. :thumbup:

To make it a bit more functional, I might suggest replacing [MeterColor] with these 3 sections.

Code: Select all

[MeterDecColor]
Meter=STRING
X=0
Y=0
W=260
Padding=15,5,15,5
FontColor=#DecColor#
SolidColor=0,0,0,120
FontSize=18
FontFace=Segoe UI
StringStyle=BOLD
StringAlign=LEFT
AntiAlias=1
Text=RGB: #DecColor#
DynamicVariables=1
LeftMouseUpAction=[!CommandMeasure MeasureInputText "ExecuteBatch 1"]

[MeterHexColor]
Meter=STRING
MeasureName=MeasureDigits
X=r
Y=R
W=260
Padding=15,5,15,5
FontColor=#DecColor#
SolidColor=0,0,0,120
FontSize=18
FontFace=Segoe UI
StringStyle=BOLD
StringAlign=LEFT
AntiAlias=1
Text=Hexa: %1
LeftMouseUpAction=[!SetClip [&MeasureDigits]]
DynamicVariables=1

[MeasureInputText]
Measure=Plugin
Plugin=InputText
InputLimit=0
InputNumber=0
X=75
Y=5
W=210
H=32
FontSize=18
FontColor=0,0,0
FontFace=Segoe UI
StringStyle=Bold
Command1=[!WriteKeyValue Variables DecColor "$UserInput$"][!Refresh]
; Command2=
DefaultValue=#DecColor#

This allows the user to left-click the RGB(A) value and enter a new value directly in the skin, and also left-click the Hex value to copy it to the clipboard.

You know how I love to tinker with skins! :D

EDIT: You'll also need to change the IfCondition bangs from [!UpdateMeter MeterColor] to [!UpdateMeter *]
User avatar
balala
Rainmeter Sage
Posts: 7628
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Converting RGB color code to hexadecimal

balala » October 28th, 2017, 9:33 pm

eclectic-tech wrote:Nice work. :thumbup:
Thanks.
eclectic-tech wrote:To make it a bit more functional, I might suggest replacing [MeterColor] with these 3 sections.
Yeah, probably the code can be improved more ways. I just wrote it and wanted to publish it, to let the users to see how a this kind of calculation can be done, even without a lua code.
But yes, adding those features, probably will improve the code, so thanks for the suggestion(s)...

Just a side note, the inverse conversion (from hex to RGB) also can be done without a lua script. I'll post the appropriate code later.
User avatar
balala
Rainmeter Sage
Posts: 7628
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Converting RGB color code to hexadecimal

balala » October 29th, 2017, 1:41 pm

balala wrote:I'll post the appropriate code later.
Here is the promised code, which converts a hexadecimal color code, to RGB, again without a lua script. I added eclectic-tech's suggestions, so now you can click and enter the new color code from the keyboard.

Code: Select all

[Rainmeter]
Update=-1
BackgroundMode=2
SolidColor=0,0,0,1
DynamicWindowSize=1

[Variables]
HexColor=ABD326CD

[ColorStyle]
W=210
H=32
Padding=15,0,15,0
FontColor=#HexColor#
SolidColor=0,0,0,120
FontSize=18
FontFace=Segoe UI
StringStyle=BOLD
StringAlign=LEFT
AntiAlias=1
DynamicVariables=1
Group=Colors

[MeasureHexComponents]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^......$":"0","^........$":"1"
IfCondition=([#CURRENTSECTION#]=0)
IfTrueAction=[!SetOption MeasureRGBDigits String "[*MeasureDecRed*],[*MeasureDecGreen*],[*MeasureDecBlue*]"][!UpdateMeasure "MeasureRGBDigits"][!UpdateMeter "MeterColor"][!Redraw]
IfFalseAction=[!SetOption MeasureRGBDigits String "[*MeasureDecRed*],[*MeasureDecGreen*],[*MeasureDecBlue*],[*MeasureDecAlpha*]"][!UpdateMeasure "MeasureRGBDigits"][!UpdateMeter "MeterColor"][!Redraw]
DynamicVariables=1

[MeasureHexRedDigit1]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^(.).*$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureHexRedDigit2]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^.(.).*$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureHexGreenDigit1]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^..(.).*$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureHexGreenDigit2]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^...(.).*$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureHexBlueDigit1]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^....(.).*$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureHexBlueDigit2]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^.....(.).*$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureHexAlphaDigit1]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^......(.).$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureHexAlphaDigit2]
Measure=String
String=#HexColor#
RegExpSubstitute=1
Substitute="^.......(.)$":"\1","A":"10","a":"10","B":"11","b":"11","C":"12","c":"12","D":"13","d":"13","E":"14","e":"14","F":"15","f":"15"
DynamicVariables=1
Group=Digits

[MeasureDecRed]
Measure=Calc
Formula=( 16 * [MeasureHexRedDigit1] + [MeasureHexRedDigit2] )
DynamicVariables=1
Group=ColorComp

[MeasureDecGreen]
Measure=Calc
Formula=( 16 * [MeasureHexGreenDigit1] + [MeasureHexGreenDigit2] )
DynamicVariables=1
Group=ColorComp

[MeasureDecBlue]
Measure=Calc
Formula=( 16 * [MeasureHexBlueDigit1] + [MeasureHexBlueDigit2] )
DynamicVariables=1
Group=ColorComp

[MeasureDecAlpha]
Measure=Calc
Formula=( 16 * [MeasureHexAlphaDigit1] + [MeasureHexAlphaDigit2] )
DynamicVariables=1
Group=ColorComp

[MeasureRGBDigits]
Measure=String
DynamicVariables=1
Group=ColorComp

[MeterHexColor]
Meter=STRING
MeterStyle=ColorStyle
X=0
Y=0
Text=#HexColor#
LeftMouseUpAction=[!CommandMeasure "MeasureInputHexColor" "ExecuteBatch 1-2"]

[MeterRGBColor]
Meter=STRING
MeterStyle=ColorStyle
MeasureName=MeasureRGBDigits
X=0r
Y=0R
Text=%1

[MeasureInputHexColor]
Measure=Plugin
Plugin=InputText
InputLimit=0
InputNumber=0
X=15
Y=0
W=210
H=32
SolidColor=220,220,220
FontSize=18
FontColor=0,0,0
FontFace=Segoe UI
StringStyle=Bold
Command1=[!SetVariable HexColor "$UserInput$"][!UpdateMeasure "MeasureInputHexColor"][!UpdateMeasure "MeasureHexComponents"][!UpdateMeasureGroup "Digits"][!UpdateMeasureGroup "ColorComp"][!UpdateMeterGroup "Colors"][!Redraw]
Command2=[!WriteKeyValue Variables HexColor "[MeasureInputHexColor]"]
DefaultValue=#HexColor#
DynamicVariables=1
The converted RGB color is returned by the [MeasureRGBDigits] measure.