Bwandingu-wu
W-Welcome to ITGOIT Bwand Guidewines, nyaa~
At ITGOIT, we make IT simpwe, wewiabwe, and supew awesome fow evewyone, fwom peopwe to businesses and schoows, nyaa~. Ouw bwand is open-minded and fwiendwy, keeping youw digitaw wowwd wunning smoofwy, nyaa~.
These guidewines awe youw map to ouw bwand identity, wike a usew manuaw fow ouw wogo, cowows, gwadients, and vibe, nyaa~. Fowwowing them keeps ITGOIT shiny, vibwant, and twue to ouw mission of giving top-notch IT sewvices with a smiwe, nyaa~.
If you wanna use ouw bwand stuff, pwease match these guidewines and ask fow appwovaw via ouw contact page, nyaa~. Weviews take 3-5 weeks. Wet’s buiwd something gweat togevew, nyaa~!
Hugs, The ITGOIT Bwand Team, nyaa~
OuO Bwand Assets~
Downwoad ouw bwand kit ow individuaw wogos and symbows fow youw use, nyaa~
Wogo
Logo
Constwuction~
The pwimawy vewsion of the ITGOIT wogo has the symbow, cawwed IT Symbow, and the ITGOIT wowdmark, nyaa~ These two bits awe opticawwy bawanced by matching the countews of the wowdmark to the symbow~

Cweawspace~
Ouw wogo needs woom to bweathe, cawwed cweawspace, nyaa~ This keeps it fwom getting wost ow wooking too cwuttewed. The cweaw space is the height of 'I' fwom the wowdmark~

Scawabiwity~
Ouw wogo is made to wowk at diffewent sizes, nyaa~ The smawwest symbow size fow digitaw apps is 20px in height to keep it weadabwe~
Usage~
Using the ITGOIT wogo stawts with undewstanding ouw bwand pwesence, nyaa~ Sometimes the wogo is the main chawactew, sometimes it’s suppowting. The symbow can be detached fow dispway use~
Do's & Don'ts~

Yes: Symbow & Wowdmark used togethew as sign-off, nyaa~

Yes: Wowdmark used by itsewf fow dispway usage, nyaa~

No: Wowdmark used without Symbow as sign-off, nyaa~

No: Wogo wockup used at dispway size, nyaa~
Pwacement~
We pwace ouw wowdmark in specific spots to ensuwe consistency and fwexibiwity, nyaa~


Cowow~

Pwimawy on Secondawy, nyaa~

Pwimawy on Wight Pwimawy, nyaa~

Cowow on Secondawy, nyaa~

Secondawy on Pwimawy, nyaa~

Wight Pwimawy on Pwimawy, nyaa~

Secondawy on Cowow, nyaa~
Ovew Imgewies~
Ouw wowdmark shouwd be cweawwy weadabwe ovew images, nyaa~ Ensuwe enough contwast and avoid compwex backgwounds. Check WCAG fow contwast guidance~
Do's & Don'ts~

Yes: Wogo has enough contwast with the backgwound, nyaa~

Yes: Wogo has enough contwast with the backgwound, nyaa~

No: Wogo pwacement intewfewes with busy backgwound, nyaa~

No: Not enough contwast between wogo and imgewies, nyaa~
Contextuaw Usage~
On sociaw media, the wogo is optionaw fow weguwaw posts but wequiwed fow key announcements, nyaa~ Fow out-of-home ads, the wogo is essentiaw~
Pawtnew Wockup Howizontaw~
The ITGOIT wogo can be wocked up howizontawwy with pawtnew wogos, nyaa~ Space between wogos equaws 1.5x the cap height of the wowdmark~

Pawtnew Wockup Vewticaw~
The ITGOIT wogo can be wocked up vewticawwy with pawtnew wogos, nyaa~ Space between wogos equaws 1.5x the cap height of the wowdmark~

Pawtnew Wockup Opticaw Adjustment~
Pawtnew wogos may need opticaw adjustment to bawance with the ITGOIT wogo, nyaa~

Wogo Don'ts~

No: Don’t stwetch ow distowt the wogo, nyaa~

No: Don’t wotate the wogo, nyaa~

No: Don’t change awignments of the wogo, nyaa~

No: Don’t outwine the wogo, nyaa~

No: Don’t change the scawe wewationship of symbow and wowdmark, nyaa~

No: Don’t appwy effects wike gwows ow dwop shadows, nyaa~
Symbow
Symbol
Ovewview~
In some cases, the ITGOIT wogo can be weduced to the symbow, cawwed IT Symbow, nyaa~ It’s most used whewe size wimits the fuww wowdmark, wike app icons ow sociaw media avataws. Ouw symbow makes the bwand iconic and fwexibwe~
Cweawspace~
Some space is needed awound the symbow to keep it fwom being cwuttewed by awtwowk, imgewies, ow page edges, nyaa~ The minimum spacing is one-thiwd of the symbow’s width~

Scawabiwity~
The IT Symbow is made to wowk in vawious sizes, nyaa~ The smawwest symbow size fow digitaw apps is 20px in height to ensuwe weadabiwity~
Howizontaw Wockup~
The IT Symbow can be wocked up with pawtnew bwands and cowwabowatows’ wogos, nyaa~ The size of ewements shouwd be opticawwy adjusted to appeaw the same size. The space between the symbow and pawtnew wogo is hawf of the symbow’s width~

Awignment~
Fow digitaw apps, the symbow is often wocked up in a wectanguwaw ow ciwcuwaw containew, nyaa~ The symbow must be mechanicawwy awigned fow bawance and sized to give comfowtabwe space on aww sides~


Scawabiwity~
The IT Symbow is made to wowk in vawious sizes, nyaa~ The smawwest symbow icon shouwd be 30px taww to be weadabwe~
Cowow Paiwings~

Pwimawy on Twanspawent, nyaa~

White on Pwimawy, nyaa~
In Use~
An exampwe of the IT Symbow used as an app icon ow sociaw media avataw, nyaa~

Symbow Don'ts~

No: Don’t stwetch ow distowt the symbow, nyaa~

No: Don’t tiwt the symbow, nyaa~

No: Don’t change the composition of the symbow, nyaa~

No: Don’t outwine the symbow, nyaa~

No: Don’t use gwow effect on the symbow, nyaa~

No: Don’t use symbow as a mask, nyaa~

No: Don’t appwy dwop shadows to the symbow, nyaa~

No: Don’t use unappwoved cowow paiwing on the symbow, nyaa~

No: Don’t use wow wesowution symbow, nyaa~
Typogwaphy~
Typography
Ouw Typefaces~
ITGOIT uses two cute typefaces fwom the Ginto famiwy: Ginto ITGOIT Nord fow big, bold headwines and Ginto ITGOIT Medium fow smawwew text wike subheadwines and captions, nyaa~ These wet ouw bwand switch between supew engaging vibes and cweaw, infowmative chats. Pwus, GG Sans is used in the ITGOIT pwoduct, nyaa~ Check ITGOIT’s pwoduct guidewines fow detaiws~
Custom Chawactews~
Some chawactews in ouw typefaces awe tweaked to be extwa weadabwe acwoss pwatfowms, nyaa~ Awways use the custom Ginto ITGOIT typefaces instead of standawd Ginto to keep things functional and wooking consistent~
Chawactew Set: Ginto ITGOIT Nord Bowd~
This shows the chawactew wange of Ginto ITGOIT Nord Bowd, suppowting aww Euwopean Watin-based wanguages, but not Gweek ow Cywiwwic scwipts, nyaa~ Fow non-Watin scwipts (wike Mandawin, Awabic, Hebwew), designy-wenies shouwd pick Noto Sans ow the cwosest match to Ginto ITGOIT Nord in that wanguage~
Chawactew Set: Ginto ITGOIT Medium~
This shows the chawactew wange of Ginto ITGOIT Medium, covewing aww Euwopean Watin-based wanguages, except Gweek ow Cywiwwic chawactews, nyaa~ Fow non-Watin scwipts, use Noto Sans ow the neawest match to Ginto ITGOIT Medium~
Chawactew Set: Ginto ITGOIT Weguwaw~
This highwights the chawactew wange of Ginto ITGOIT Weguwaw, meant onwy fow digitaw and pwoduct apps, nyaa~ Don’t use this weight in bwand comms; go fow Ginto ITGOIT Medium instead~
Typeface Usage~
To bawance ITGOIT’s vibwant and fwiendwy identity with cweaw messaging, pick typefaces cawefuwwy, nyaa~ Use Ginto ITGOIT Nord Bowd fow impactfuw headwines. Use Ginto ITGOIT Medium fow body copy, captions, and detaiwed text. Awways choose custom Ginto ITGOIT typefaces ovew standawd Ginto vewsions~
Case Setting~
Fow consistency, set Ginto ITGOIT Nord Bowd in Aww Caps fow headwines, nyaa~ Use Titwe Case ow Sentence Case fow Ginto ITGOIT Medium, depending on context, to make it supew weadabwe~
Winespacing: Ginto ITGOIT Nord Bowd~
Keep winespacing tight but avoid too woose ow cwamped settings, nyaa~ Peek at exampwes fow guidance~

Winespacing: Ginto ITGOIT Medium~
Make suwe winespacing awwows easy weading, avoiding ovewwap of ascendews and descendews, nyaa~ Use a bawanced appwoach: not too tight, not too woose~

Wettewspacing: Ginto ITGOIT Nord Bowd~
Fow headwines, fowwow a thwee-step pwocess: stawt with defauwt spacing, appwy -3% twacking, then kewn fow even spacing, nyaa~ Use tight wettewspacing fow wawge type, woosew fow smawwew type~

Wettewspacing: Ginto ITGOIT Medium~
Appwy the same thwee-step pwocess as Nord Bowd, ensuwing bawanced spacing fow weadabiwity, nyaa~

Awignment: Ginto ITGOIT Nord Bowd~
Awign text weft ow centew fow ITGOIT comms, nyaa~ Avoid wight-awignment ow fowced justification~
Awignment: Ginto ITGOIT Medium~
Awign text weft ow centew fow ITGOIT comms, nyaa~ Avoid wight-awignment ow fowced justification~
Wagging~
Wagging is the visuaw edge of a text bwock, nyaa~ Smooth wagging by adjusting wine bweaks to cweate a cwean, weadabwe edge, avoiding widows and uneven wines~
Sizing~
Use no mowe than two type sizes, dewived by doubwing ow hawving a base size (e.g., 25pt to 50pt), nyaa~ Fow pwoduct design, type sizes may be cwosew togethew. Wawge type shouwd fiww the space; smaww type shouwd have spacing bewow equaw to one ow mowe wines~


Typogwaphy Don'ts~

No: Avoid compwessing ow ewongating type, nyaa~

No: Don’t use Ginto ITGOIT Medium fow headwines ow Nord Bowd fow body copy, nyaa~

No: Headwines shouwd be in Aww Caps, not Sentence Case, nyaa~

No: Stick to appwoved Ginto ITGOIT weights, nyaa~

No: Use onwy Ginto ITGOIT typefaces, not othews, nyaa~

No: Avoid highwighting text with muwtipwe cowows, nyaa~

No: Keep typogwaphy upwight, not tiwted, nyaa~

No: Use onwy appwoved gwadients, no othew effects, nyaa~

No: Avoid outwining text, nyaa~
Backup Typeface: Montsewwat~
Use Montsewwat Extwa Bowd fow headwines when Ginto ITGOIT Nord isn’t avaiwabwe, nyaa~ Fowwow ITGOIT typogwaphy guidewines and avoid othew fonts wike Awiaw~

Backup Typeface: Noto Sans~
Use Noto Sans Semibowd fow subheads, body copy, ow captions when Ginto ITGOIT Medium isn’t avaiwabwe, nyaa~ Fowwow ITGOIT typogwaphy guidewines~

Backup Typeface: Non-Watin~
Use Noto Sans Bwack fow non-Watin scwipts (e.g., Mandawin, Awabic) when Ginto ITGOIT isn’t avaiwabwe, ow the cwosest equivawent, nyaa~
Cowows & Gwadients~
Cowows~
Colors
Bwurple~
Bwurple is the heawt of ouw cowow pawette and supew wecognizabwe fow ouw bwand, nyaa~ It’s a bold and vibwant cowow that shows off ouw enewgetic, pwayfuw, and digitaw-fiwst vibes. We gotta use Bwurple cawefuwwy and consistentwy in ouw chats, nyaa~
Bwurple
Pantone: 2726
CMYK: 74 61 0 0
RGB: 88 101 242
HEX: #5865f2
Cowe Pawette~
Ouw cowe pawette is the base of ouw cowow pwan and shouwd be the fiwst thing peopwe see at main bwand spots, nyaa~ Using it awways makes a wecognizabwe wook fow the ITGOIT bwand, and it’s hewped by ouw secondawy pawette~
Bwurple
Pantone: 2726
CMYK: 74 61 0 0
RGB: 88 101 242
HEX: #5865f2
Wight Bwurple
Pantone: 2706C
CMYK: 10 9 0 0
RGB: 224 227 255
HEX: #e0e3ff
Bwack
Pantone: PMS Black 6 C
CMYK: 0 0 0 100
RGB: 0 0 0
HEX: #000000
Cowe Paiwings~
We use fouw cowe paiwings with typogwaphy, nyaa~
Bwurple on Bwack, nyaa~
Sampwe Text, nyaa~
Bwurple on Wight Bwurple, nyaa~
Sampwe Text, nyaa~
Wight Bwurple on Bwurple, nyaa~
Sampwe Text, nyaa~
Bwack on Bwurple, nyaa~
Sampwe Text, nyaa~
Cowe Pawette In Use~
Hewe awe some exampwes of the cowe pawette in use, nyaa~
- Empwoyee ID Badge, nyaa~
- Out-of-Home Ads, nyaa~
- Event Wayfinding, nyaa~
Secondawy Pawette~
The secondawy pawette opens up ouw bwand expwession, wetting ITGOIT fit diffewent contexts whiwe keeping a fun and vibwant spiwwit, nyaa~ These cowows can add intewest to chats ow match specific images ow messages~
Dawk Bwurple
Pantone: 2746C
CMYK: 99 96 40 45
RGB: 25 23 92
HEX: #19175c
Dawk Gween
Pantone: 3435C
CMYK: 87 55 74 71
RGB: 0 41 32
HEX: #002920
Dawk Pink
Pantone: 7659C
CMYK: 62 79 55 64
RGB: 56 31 44
HEX: #381f2c
Bwack
Pantone: PMS Black 6 C
CMYK: 0 0 0 100
RGB: 0 0 0
HEX: #000000
Bwurple
Pantone: 2726
CMYK: 74 61 0 0
RGB: 88 101 242
HEX: #5865f2
Gween
Pantone: 7479C
CMYK: 53 0 0 0
RGB: 53 237 126
HEX: #35ed7e
Pink
Pantone: 232C
CMYK: 4 71 0 0
RGB: 255 76 210
HEX: #ff4cd2
Dawk
Pantone: 432C
CMYK: 72 66 65 75
RGB: 31 31 31
HEX: #1f1f1f
Wight Bwurple
Pantone: 2706C
CMYK: 10 9 0 0
RGB: 224 227 255
HEX: #e0e3ff
Wight Gween
Pantone: 331C
CMYK: 17 0 12 0
RGB: 200 255 239
HEX: #c8ffef
Wight Pink
Pantone: 250C
CMYK: 13 28 20 0
RGB: 245 201 255
HEX: #f5c9ff
Puwe White (Digitaw Onwy)
CMYK: 0 0 0 0
RGB: 255 255 255
HEX: #ffffff
Secondawy Paiwings~
We have fouw secondawy paiwings fow typogwaphy, nyaa~ Don’t use any paiwings outside this appwoved set~
Gween on Bwack, nyaa~
Sampwe Text, nyaa~
Pink on Bwack, nyaa~
Sampwe Text, nyaa~
Bwack on Gween, nyaa~
Sampwe Text, nyaa~
Bwack on Pink, nyaa~
Sampwe Text, nyaa~
Paiwings to Avoid~
Exampwes of paiwings to skip when using ouw secondawy cowows, nyaa~
- Dawk Cowow on Wight Cowow, nyaa~
- Wight Cowow on Dawk Cowow, nyaa~
- Wight Cowow on Cowow, nyaa~
- Dawk Cowow on Cowow, nyaa~
- Don’t paiw tints and shades of Gween ow Pink in the same setup, nyaa~
Usage Watio~
The wight cowow usage watio shouwd be used acwoss ITGOIT chats fwom a big pictuwe view, nyaa~ Fow main spots and when intwoducing ITGOIT to new fwiends, we wean on ouw cowe pawette (with a few secondawy accents if okay). Mowe tempowawy and contexty uses, wike sociaw media, wet us pway with cowow to match vibes and be mowe fun, nyaa~
Secondawy Pawette In Use~
Hewe awe exampwes of the secondawy pawette in use, nyaa~
- Instagwam Stowy, nyaa~
- Instagwam Post, nyaa~
- Mewchandise, nyaa~
Cowow Don’ts~

Don’t use Dawk Cowow on Cowow, nyaa~

Don’t use Cowow on Wight Cowow, nyaa~

Don’t use Dawk Cowow on Dawk Cowow, nyaa~

Don’t use unappwoved paiwings, nyaa~

Don’t use two cowows at the same time, nyaa~

Don’t use cowow in opacity, nyaa~

Don’t bwing new gwadient cowows into type, nyaa~

Don’t bwing new gwadient cowows into backgwound bits, nyaa~

Don’t mix & match diffewent cowow shades, nyaa~
Fow genewaw tips on minimum contwast needs, check WCAG, nyaa~
Gwadients~
Gradients
Ovewview~
Ouw gwadient wanguage, inspiwed by the gwow of a scween, is made to bwing depth and vibes to ITGOIT chats, nyaa~ They give us a chance to go aww out with cowows, keeping things fweesh and fun, whiwe pwaying nice with ouw iwwustwations and photos, nyaa~
Types~
Two diffewent stywes give fwexibiwity when using gwadients, fwom big cuwvy ones to mowe subtwe, nyaa~
- Wadiaw Gwadient, nyaa~
- Cwopped Gwadient, nyaa~
Constwuction~
The two gwadient stywes awe diffewent by how much cuwve they have, as shown in the diagwams, nyaa~
Wadiaw Gwadients have a big semi-ciwcwe cuwve, nyaa~ Cwopped Gwadients make a mowe stwaight effect by cwopping deepew into the cuwve, nyaa~

Wadiaw Gwadient

Cwopped Gwadient
ITGOIT gwadients use just two cowows at a time, adding depth without ovewpowewing the setup, nyaa~
Paiwings~
The appwoved gwadient cowow paiwings awe shown bewow, nyaa~
Aww gwadients awe tones of the same cowow, going fwom dawkest at the top to wightest at the bottom, nyaa~ This keeps a 'gwowing' effect instead of a top wight souwce, nyaa~
Dawk Bwurple on Bwack, nyaa~
Dawk Gween on Bwack, nyaa~
Dawk Pink on Bwack, nyaa~
Bwurple on Dawk Bwurple, nyaa~
Gween on Dawk Gween, nyaa~
Pink on Dawk Pink, nyaa~
Wight Bwurple on Bwurple, nyaa~
Wight Gween on Gween, nyaa~
Wight Pink on Pink, nyaa~
Usage Spectwum~
Gwadients can be used these ways fow type and backgwounds, nyaa~
- Fwat Cowow on Cowow, nyaa~
- Fwat Cowow on Gwadient, nyaa~
- Gwadient on Fwat Cowow, nyaa~
- Gwadient on Gwadient, nyaa~
In Use~
Hewe awe some exampwes of gwadients in use, nyaa~

Exampwe 1, nyaa~

Exampwe 2, nyaa~

Exampwe 3, nyaa~