Template:Color

Template documentation [view] [edit] [history] [purge]

Retrieve's the color of a given key in any color format (default hex).

Parameters

key - key, options are CitadelCategoryTech, hero_lash, CitadelCategoryWeapon, hero_mirage, hero_haze, hero_atlas, hero_inferno, hero_ghost, hero_yamato, hero_dynamo, hero_chrono, hero_bebop, hero_gigawatt, hero_wraith, hero_warden, hero_shiv, CitadelCategoryArmor, hero_orion, Citadel_LaneStats_Souls, hero_hornet, hero_viscous, Citadel_Profile_Stats_Healing, hero_forge,
color_format - color format - Defaults to hex. Valid options are hex, rgb, hsl, cmyk
no_wrap - (OPTIONAL) - Defaults to false. Set to true to remove prefixes and postfixes of '#' from hex, or 'rgb()', 'hsl()', and 'cmyk()' from the other formats. May be useful for altering the values dynamically
debug_mode - (OPTIONAL) - Defaults to false. Used mostly for documentation purposes

Examples

To retrieve the color alone {{Color|Tech}}

<templatestyles src="Template:Color/styles.css" />Tech

To retrieve other color formats {{Color|Tech|rgb}}

<templatestyles src="Template:Color/styles.css" />rgb

To style text: <span style="color: {{Color|Weapon}};">Weapon colored text</span>

<span style="color: <templatestyles src="Template:Color/styles.css" />Weapon;">Weapon colored text

To style divs: <div style="background-color: {{Color|Tech}};"> Tech colored div</div>

<div style="background-color: <templatestyles src="Template:Color/styles.css" />Tech;"> Tech colored div

To get the color without otherwise necessary prefix/postfix wrapping:

{{Color|Tech|rgb|no_wrap=true}}

<templatestyles src="Template:Color/styles.css" />rgb

This can manually be wrapped like rgba({{Color|Tech|no_wrap=true}}, 0.5) to customize the alpha channel (opacity/transparency) of the color to your liking. Note that with transparency, the color will vary on light or dark mode, so consider adding a white/black background behind to enforce consistency.

To alter the alpha value using rgb dynamically: <div style="background-color: rgba({{Color|Armor|rgb|no_wrap=true}}, 1.0);"> Armor colored div with 1.0 alpha</div>

<div style="background-color: rgba(<templatestyles src="Template:Color/styles.css" />rgb, 1.0);"> Armor colored div with 1.0 alpha

<div style="background-color: rgba({{Color|Armor|rgb|no_wrap=true}}, 0.5);"> Armor colored div with 0.5 alpha</div>

<div style="background-color: rgba(<templatestyles src="Template:Color/styles.css" />rgb, 0.5);"> Armor colored div with 0.5 alpha

Previews

Key	English	Hex Code	Colored div	Colored Text	Colored Underline
CitadelCategoryWeapon	Weapon	#d5903f	CitadelCategoryWeapon	CitadelCategoryWeapon	CitadelCategoryWeapon
CitadelCategoryArmor	Vitality	#74b01c	CitadelCategoryArmor	CitadelCategoryArmor	CitadelCategoryArmor
CitadelCategoryTech	Spirit	#c288f0	CitadelCategoryTech	CitadelCategoryTech	CitadelCategoryTech
Citadel_LaneStats_Souls	Souls	#98ffde	Citadel_LaneStats_Souls	Citadel_LaneStats_Souls	Citadel_LaneStats_Souls
Citadel_Profile_Stats_Healing	Healing	#00FF9A	Citadel_Profile_Stats_Healing	Citadel_Profile_Stats_Healing	Citadel_Profile_Stats_Healing
hero_atlas	Abrams	#2193AE	hero_atlas	hero_atlas	hero_atlas
hero_wraith	Wraith	#954E7A	hero_wraith	hero_wraith	hero_wraith
hero_viscous	Viscous	#8AC365	hero_viscous	hero_viscous	hero_viscous
hero_orion	Grey Talon	#61B083	hero_orion	hero_orion	hero_orion
hero_hornet	Vindicta	#87A8B8	hero_hornet	hero_hornet	hero_hornet
hero_inferno	Infernus	#FF472E	hero_inferno	hero_inferno	hero_inferno
hero_forge	McGinnis	#466A9C	hero_forge	hero_forge	hero_forge
hero_haze	Haze	#AE6231	hero_haze	hero_haze	hero_haze
hero_ghost	Lady Geist	#088A5C	hero_ghost	hero_ghost	hero_ghost
hero_mirage	Mirage	#87683C	hero_mirage	hero_mirage	hero_mirage
hero_lash	Lash	#444C57	hero_lash	hero_lash	hero_lash
hero_gigawatt	Seven	#EC963F	hero_gigawatt	hero_gigawatt	hero_gigawatt
hero_yamato	Yamato	#6F9181	hero_yamato	hero_yamato	hero_yamato
hero_warden	Warden	#566279	hero_warden	hero_warden	hero_warden
hero_bebop	Bebop	#A04835	hero_bebop	hero_bebop	hero_bebop
hero_chrono	Paradox	#993A53	hero_chrono	hero_chrono	hero_chrono
hero_dynamo	Dynamo	#D0BA46	hero_dynamo	hero_dynamo	hero_dynamo
hero_shiv	Shiv	#A53D88	hero_shiv	hero_shiv	hero_shiv