Brand and press
Writing about Gyral, giving a talk, or showing that your project is built with it? Use the files on this page. The complete kit, with every variant, print-ready PDFs and the construction notes, is in the gyraljs/brand repository.
The mark
A gyre: a spiral that turns outward from a point in eight quarter-turns, each wider than the last. It stands for the loop at the heart of Model-View-Intent (intent feeds the model, the model drives the view, the view produces new intent) and for that loop growing with an application. The name means the same thing: gyral, of a gyre, turning. Four colours travel round the spiral in a fixed order, blue, red, yellow, green, twice.
Downloads
Use the horizontal logo by default, the stacked logo in square or tall spaces, and the mark alone where the name is already nearby (avatars, icons).
Horizontal logo, on white SVG PNG, 1024 px 
Horizontal logo, on black SVG PNG, 1024 px 
Stacked logo, on white SVG PNG, 1024 px 
Stacked logo, on black SVG PNG, 1024 px 
Mark, on white SVG PNG, 1024 px 
Mark, on black SVG PNG, 1024 px
Colour
Bright
For dark backgrounds.
- Blue
#2F6FEDoklch(57.4% 0.202 262.0) - Red
#E5483Boklch(62.3% 0.196 28.7) - Yellow
#F5B400oklch(80.9% 0.167 82.3) - Green
#2E9E5Boklch(62.1% 0.141 152.7)
Deep
For light backgrounds, where the bright yellow would lose contrast.
- Deep blue
#2A63D6oklch(53.1% 0.187 262.2) - Deep red
#D93A2Eoklch(58.8% 0.198 28.9) - Deep yellow
#C98F00oklch(68.9% 0.143 79.7) - Deep green
#1F8A4Coklch(56.0% 0.134 152.5)
Neutral
The brand black is the dark background; never pure #000.
- Black
#121317oklch(18.7% 0.008 274.5) - White
#FFFFFFoklch(100% 0 0)
Using the logo
Do
- Use the files as they are.
- Use the on-white versions on light backgrounds and the on-black ones on dark.
- Keep clear space of a quarter of the mark's height on every side.
- Keep the horizontal logo at least 96 px wide on screen, the mark at least 16 px.
- Use the one-colour versions from the full kit on photos and busy backgrounds.
Don't
- Recolour the mark, change its colour order, or swap the palettes.
- Rotate, mirror, stretch, outline it, or add shadows or glows.
- Retype the word in another typeface or with a capital: the logo is always "gyral".
- Use the mark as a pattern, a bullet, or decoration in other artwork.
In running text, write Gyral. Use gyraljs where the plain word is ambiguous or taken: the GitHub organisation, social handles, search.
Trademarks
Gyral, gyraljs and the Gyral logo are trademarks of Mike Zupper. The code is open source under the MIT license; the artwork is not, so that the logo only ever means "this is Gyral".
You may use the logos, without asking, to:
- refer to Gyral in articles, talks, tutorials, books and videos;
- say your project works with, is built with, or supports Gyral, without suggesting endorsement;
- make community material, such as meetup slides and non-commercial stickers, that follows these rules.
Ask first, by opening an issue in gyraljs/brand, to use them in a product, company or project name or logo, a domain or a social handle, to sell anything that carries them, or to change them.