Brand

On this page

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:

css
: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 width and height; never stretch, never object-fit: cover.
  • Clear space: at least a quarter of the "G" icon's height on every side.
HTML
<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.

HTML
<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:

HTML
<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:

C#
using GullyLabs.GameSdk;

GullyStudioTheme.ApplyTo(Camera.main); // sets the camera clear colour to the brand navy

The 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].