Branding: Difference between revisions

Latest revision as of 11:52, 29 May 2024

When creating Resonite content and representing us out in the world, it is important to use our up to date logos, fonts etc.

Press Kit

To make this easy for you we've prepared a press kit that you can use, the latest version is always on our website

Guidelines for Use

When using our branding kit for your content make sure to follow all guidelines. Beyond these, just make sure you're representing our brand as best as you can. Check the kit for updates every now and then and keep an eye out for announcements on changes etc. There will likely be more files and logos as we continue working on this area.

Colors

Resonite uses these colors! You can get quick access to them in game using the PlatformColorPalette component. These colors can be applied to things such as Text using Text Formatting.

Name	Hex Code	Color
Neutrals
Dark	#11151d
Mid	#2b2f35
Dark-Light	#4a4a4d
Mid-Light	#86888b
Light	#e1e1e0
Hero
Yellow	#f8f770
Green	#59eb5c
Red	#ff7676
Purple	#ba64f2
Cyan	#61d1fa
Orange	#e69e50
Mid-Light
Yellow	#a0a14e
Green	#3f9e44
Red	#ae5458
Purple	#824aab
Cyan	#458fab
Orange	#976c3d
Dark-Light
Yellow	#62644a
Green	#3f6a47
Red	#765258
Purple	#664e7e
Cyan	#456776
Orange	#625548
Sub
Yellow	#484a2c
Green	#24512c
Red	#5d323a
Purple	#492f64
Cyan	#284c5d
Orange	#48392a
Dark
Yellow	#2b2e26
Green	#192d24
Red	#1a1318
Purple	#241e35
Cyan	#1a2a36
Orange	#292423

@@ Line 1: / Line 1: @@
 <!--T:1-->
-When creating Resonite content and representing us out in the world, it is important to use our up to date logos, fonts etc.
+When creating [[Resonite]] content and representing us out in the world, it is important to use our up to date logos, fonts etc.
 == Press Kit == <!--T:2-->
-To make this easy for you we've prepared a [https://resonite.com Press Kit] that you can use, the latest version is always on our website
+To make this easy for you we've prepared a [https://resonite.com press kit] that you can use, the latest version is always on our website
 == Guidelines for Use == <!--T:3-->
-When using our Branding Kit for your content make sure to follow all [[Guidelines]]. Beyond these, just make sure you're representing our brand as best as you can. Check the kit for updates every now and then and keep an eye out for announcements on changes etc. There will likely be more files and logos as we continue working on this area.
+When using our branding kit for your content make sure to follow all [[Branding Guidelines|guidelines]]. Beyond these, just make sure you're representing our brand as best as you can. Check the kit for updates every now and then and keep an eye out for announcements on changes etc. There will likely be more files and logos as we continue working on this area.
+== Colors ==<!--T:4-->
+Resonite uses these colors! You can get quick access to them in game using the [[Component:PlatformColorPalette|PlatformColorPalette]] component. These colors can be applied to things such as Text using [[Text Formatting]].
+{| class=wikitable
+|-
+! Name !! Hex Code !! Color
+|-
+! colspan=3 style="text-align: center;" | Neutrals
+|-
+| Dark || #11151d || style="background-color:#11151d;min-width:50px;" |
+|-
+| Mid || #2b2f35 || style="background-color:#2b2f35;min-width:50px;" |
+|-
+| Dark-Light || #4a4a4d || style="background-color:#4a4a4d;min-width:50px;" |
+|-
+| Mid-Light || #86888b || style="background-color:#86888b;min-width:50px;" |
+|-
+| Light || #e1e1e0 || style="background-color:#e1e1e0;min-width:50px;" |
+|-
+! colspan=3 style="text-align: center;" | Hero
+|-
+| Yellow || #f8f770 || style="background-color:#f8f770;min-width:50px;" |
+|-
+| Green || #59eb5c || style="background-color:#59eb5c;min-width:50px;" |
+|-
+| Red || #ff7676 || style="background-color:#ff7676;min-width:50px;" |
+|-
+| Purple || #ba64f2 || style="background-color:#ba64f2;min-width:50px;" |
+|-
+| Cyan || #61d1fa || style="background-color:#61d1fa;min-width:50px;" |
+|-
+| Orange || #e69e50 || style="background-color:#e69e50;min-width:50px;" |
+|-
+! colspan=3 style="text-align: center;" | Mid-Light
+|-
+| Yellow || #a0a14e || style="background-color:#a0a14e;min-width:50px;" |
+|-
+| Green || #3f9e44 || style="background-color:#3f9e44;min-width:50px;" |
+|-
+| Red || #ae5458 || style="background-color:#ae5458;min-width:50px;" |
+|-
+| Purple || #824aab || style="background-color:#824aab;min-width:50px;" |
+|-
+| Cyan || #458fab || style="background-color:#458fab;min-width:50px;" |
+|-
+| Orange || #976c3d || style="background-color:#976c3d;min-width:50px;" |
+|-
+! colspan=3 style="text-align: center;" | Dark-Light
+|-
+| Yellow || #62644a || style="background-color:#62644a;min-width:50px;" |
+|-
+| Green || #3f6a47 || style="background-color:#3f6a47;min-width:50px;" |
+|-
+| Red || #765258 || style="background-color:#765258;min-width:50px;" |
+|-
+| Purple || #664e7e || style="background-color:#664e7e;min-width:50px;" |
+|-
+| Cyan || #456776 || style="background-color:#456776;min-width:50px;" |
+|-
+| Orange || #625548 || style="background-color:#625548;min-width:50px;" |
+|-
+! colspan=3 style="text-align: center;" | Sub
+|-
+| Yellow || #484a2c || style="background-color:#484a2c;min-width:50px;" |
+|-
+| Green || #24512c || style="background-color:#24512c;min-width:50px;" |
+|-
+| Red || #5d323a || style="background-color:#5d323a;min-width:50px;" |
+|-
+| Purple || #492f64 || style="background-color:#492f64;min-width:50px;" |
+|-
+| Cyan || #284c5d || style="background-color:#284c5d;min-width:50px;" |
+|-
+| Orange || #48392a || style="background-color:#48392a;min-width:50px;" |
+|-
+! colspan=3 style="text-align: center;" | Dark
+|-
+| Yellow || #2b2e26 || style="background-color:#2b2e26;min-width:50px;" |
+|-
+| Green || #192d24 || style="background-color:#192d24;min-width:50px;" |
+|-
+| Red || #1a1318 || style="background-color:#1a1318;min-width:50px;" |
+|-
+| Purple || #241e35 || style="background-color:#241e35;min-width:50px;" |
+|-
+| Cyan || #1a2a36 || style="background-color:#1a2a36;min-width:50px;" |
+|-
+| Orange || #292423 || style="background-color:#292423;min-width:50px;" |
+|}