Primary mark · vector
SVG1024 × 1024 · 0.7 KB
Best for Canva — scales with no quality loss (sky tile + mark)
Brand assets
Stayora Brand Kit
Every logo file, hex code and font weight the brand uses — in one place. The page is machine-readable as well as human-readable, so a Brand Kit importer picks the palette, logo and type up from the URL below; if anything is missed, every value is also one click away on this page.
Brand Kit URL
https://stayora.va7.dev/brand
SVG + PNG
Light + dark
Free to use
Logos
Nine files: vector + raster, in transparent, white-background and black-background versions. Click a card's link to copy its address, or download it directly.
Symbol · sky tile
PNG1024 × 1024 · 26.0 KB
App icon, avatar, social profile — rounded tile, transparent corners
Icon · favicon size
PNG512 × 512 · 24.8 KB
Favicon, preview image, small avatars — square, opaque tile
Symbol · bare (transparent)
PNG256 × 187 · 13.0 KB
The mark on its own with no background — works on light and dark
Symbol · on white
PNG1024 × 1024 · 21.2 KB
Documents, print, light slides — white square (opaque, no transparency)
Wordmark · transparent
PNG1000 × 194 · 100.9 KB
Header and footer on white — dark text, transparent background
Wordmark · on white
PNG2172 × 724 · 632.8 KB
Hi-res decks and documents with a white background
Symbol · on black
PNG1254 × 1254 · 696.9 KB
Solid black backgrounds — white text stays white, mark keeps its colour
Wordmark · on black
PNG2172 × 724 · 488.9 KB
Dark slides, video, social — hi-res, opaque black bar
✓ Do
- Keep clear space of at least the height of the logo's apex around the mark.
- Use the black-background wordmark (
… - Black Background.png) on dark or photographic backgrounds. - Use the transparent files (
stayora-wordmark.png,stayora-symbol.png) when the artwork must sit on its own background. - Use the SVG wherever the tool accepts it (Canva does) — it never pixelates.
- Minimum sizes: symbol 24 px, wordmark 90 px wide.
✕ Don't
- Recolour, outline or add effects to the mark.
- Stretch, rotate or crop it.
- Put an opaque white-background file on a dark design — it shows up as a white box. Use the
- Black Backgroundversion instead (and the reverse for dark text on light). - Rebuild the wordmark out of a different typeface.
Colours
Click any swatch to copy its hex code. 18 colours total.
Primary ramp · Stayora Blue
Neutrals
Logo colours (from the mark)
These four live inside the logo itself. Keep them when exporting artwork so the
mark never drifts from the files above.
Typography
One family, four weights — Inter (Google Fonts, free for commercial use).
Aa
Inter 400
Regular · Body copy, paragraphs, table data
Aa
Inter 500
Medium · Navigation, labels, captions
Aa
Inter 600
SemiBold · Buttons, emphasis, table headers
Aa
Inter 700
Bold · Headings, numbers, hero text
| Element | Size | Weight | Tracking | Sample |
|---|---|---|---|---|
| Display / H1 | clamp(2.25rem, 5vw, 3.5rem) | 700 | -0.03em | Hostels, run right |
| H2 | clamp(1.75rem, 3vw, 2.5rem) | 700 | -0.02em | Everything in one place |
| H3 | 1.25rem | 700 | -0.01em | Attendance & meals |
| Body | 1rem / 1.65 | 400 | 0 | Run your entire hostel from one dashboard. |
| Small | 0.875rem | 400 | 0 | Captions, helper text, table cells |
| Button | 0.9375rem | 600 | 0 | Get Started For Free |
In Canva: search Inter in the font
picker — it is in Canva's library, so no upload is needed. Fallback stack when a tool
lacks Inter:
ui-sans-serif, system-ui, sans-serif.
Take the kit with you
Everything as one block of text — colours, logos and type — or all nine logo files in a single archive.