Brand
Player-facing UI in Gully Studio games and sites follows the GullyStudio brand kit. The full kit is served at gullystudio.xyz/brand/ (opens in a new tab). Files are final: copy them byte for byte, never resize, re-encode, recolour, crop or redraw them.
#Colours
| Token | Hex | Use |
|---|---|---|
--gs-navy |
#06121F |
primary background |
--gs-navy-2 |
#07121F |
card and badge surface |
--gs-blue |
#1E8BFF |
primary accent, primary buttons |
--gs-blue-deep |
#1E6FFF |
gradient bottom, bars |
--gs-cyan |
#19D3FF |
highlight, focus, gradient top |
--gs-green |
#2EE68A |
success, buy, live |
--gs-silver |
#E8EEF5 |
text on dark |
--gs-muted |
#8FA6C2 |
secondary text on dark |
The Studio gradient runs top to bottom from cyan to deep blue:
:root {
--gs-navy: #06121F; --gs-navy-2: #07121F;
--gs-blue: #1E8BFF; --gs-blue-deep: #1E6FFF;
--gs-cyan: #19D3FF; --gs-green: #2EE68A;
--gs-silver: #E8EEF5; --gs-muted: #8FA6C2;
--gs-studio-gradient: linear-gradient(180deg, #19D3FF 0%, #1E6FFF 100%);
--gs-font: "Montserrat", system-ui, sans-serif;
}#Type
Montserrat: 800 for headings, 600 for labels and buttons. Load it from Google Fonts when the UI uses brand type.
#Logo and icon
| Asset | File | Rule |
|---|---|---|
| Logo | logo/gullystudio-logo-transparent.png (2070 x 593), logo/gullystudio-logo.svg |
dark backgrounds only (#06121F or darker); never on white |
| Icon | icon/gullystudio-icon-transparent.png, icon/gullystudio-icon-512.png and smaller |
square spots: app tiles, avatars, store listings |
- Header size: 207 x 59 (one tenth). Other allowed sizes keep the 2070:593 ratio: 276 x 79, 345 x 99, 414 x 119.
- Always set explicit
widthandheight; never stretch, neverobject-fit: cover. - Clear space: at least a quarter of the "G" icon's height on every side.
<img src="https://gullystudio.xyz/brand/logo/gullystudio-logo-transparent.png" width="207" height="59" alt="GullyStudio">#Badges
"Powered by GullyStudio" and "Secured by GullyStudio" badges come in dark and light variants, as SVG (text outlined, no fonts needed) and PNG at 1x, 2x and 3x. Render at exactly 194 x 56 CSS pixels, or 388 x 112 for large placements. Use -dark on dark pages and -light on light pages.
<a href="https://gullystudio.xyz" target="_blank" rel="noopener" aria-label="Powered by GullyStudio">
<img src="https://gullystudio.xyz/brand/badges/powered-by-gullystudio-dark.svg" width="194" height="56" alt="Powered by GullyStudio">
</a>PNG with retina variants:
<img src="https://gullystudio.xyz/brand/badges/secured-by-gullystudio-dark.png"
srcset="https://gullystudio.xyz/brand/badges/secured-by-gullystudio-dark.png 1x,
https://gullystudio.xyz/brand/badges/secured-by-gullystudio-dark-2x.png 2x,
https://gullystudio.xyz/brand/badges/secured-by-gullystudio-dark-3x.png 3x"
width="194" height="56" alt="Secured by GullyStudio">#In Unity: GullyStudioTheme
The Gully Game SDK carries the tokens as GullyStudioTheme: navy, Studio blue, cyan, green, silver, muted and the cyan-to-blue gradient. Use them for UI colours instead of typing hex values:
using GullyLabs.GameSdk;
GullyStudioTheme.ApplyTo(Camera.main); // sets the camera clear colour to the brand navyThe SDK's Documentation~/brand/ and the template's docs/brand/ hold byte-exact copies of the logo and icon.
#Social and sharing
Pages share with the kit's 1200 x 630 Open Graph image, referenced by an absolute https URL. Social profile images and banners (X, YouTube, Facebook, Telegram) are in the kit's social/ folder and are circle-crop safe.
#Questions
Brand questions or a new asset request: [email protected].