The trend line
A chart draws what is known as a solid line and where it leads as dots. The mark is that line at the moment a market turns up, and the homepage draws the coming week the same way.
Brand guide
How StayTrend looks, moves and speaks, and the files to use when you write about it or build with it. Please use the files as supplied.
The idea
StayTrend reads asking prices for nights that have not happened yet, every day, so every market has a direction. The identity is drawn from it: one line through the coming nights.
Know where your nights are heading.
Weekend nights, Eid, Riyadh Season, the Dubai Shopping Festival and the week of a big conference all move a market. StayTrend reads where it is heading every day and prices every night in the calendar.
The region at night
Prices are for nights, so the palette is the Gulf after dark: Layl for ink, Fayrouz, the turquoise of the Gulf’s shallows and of Sinai, for the trend, and Shams for the warm weekend nights.
The mark
The trend line: a Fayrouz tile carrying one white line that runs level, turns up and continues as two dots that grow as it rises.
- The tile
- Fayrouz, with corners 23% of its side. The line is always white on it, or knocked out in one colour.
- The stroke
- The market as collected today: asking prices for the coming nights, level and then turning up.
- The dots
- Where the line leads. They grow as it rises, so the mark reads as movement even at favicon size.
Sizes
From 32 px the mark is drawn in full. At 16 px the stroke thickens and the dots grow, so the line survives the pixel grid.
128 pxFull detail- 64 pxFull detail
32 pxFull detail, favicon
16 pxHeavier line
Don’t
- Put gradients, sheen or shadows on the mark.
- Point the line down, flip it or tilt it, even on Arabic pages.
- Recolour the line or draw the tile in outline only.
- Add more dots, or join the dots to the stroke.
Lockups
The mark sits before the wordmark in reading order: on the left in English and on the right in Arabic. The wordmark is StayTrend, set in Readex Pro 600.
Clear space
Keep space around a lockup at least half the mark’s width, free of text and other graphics.
Minimum size
Keep a lockup at least 24 px tall on screen and 8 mm tall in print, and the mark alone at least 16 px.
Writing the name
StayTrend is one word with a capital S and T. In Arabic, write ستاي ترند, as two words.
Colour
The region at night. Fayrouz is the trend and appears once per screen at full strength; Layl, Milh and the greys keep everything around it quiet. Each ratio is measured against the colour it is paired with, and every pair used for text passes WCAG AA (4.5:1).
- Aa14.9:1AAALayl
--laylNight. Ink, primary buttons and dark surfaces.
- Aa4.0:1AA LargeFayrouz
--fayrouzTurquoise, the trend: the mark, the trend line, peak nights and links. Text on it uses the deep Fayrouz fill.
- Aa8.0:1AAAShams
--shamsSun: weekend and high-demand nights, and warm highlights. Text on Shams is Layl.
- Aa6.7:1AANil
--nilNile blue: information, a second chart series and prices below the market.
- Aa5.1:1AAHenna
--hennaPrices above the market and the top of the heat ramp.
- Aa14.9:1AAAWhite
--whiteSurfaces: panels, cells and the app’s working area.
- Aa13.5:1AAAMilh
--milhSalt: the page canvas, a cool off-white from the Gulf’s salt flats.
- Aa5.7:1AAJamr
--jamrEmber: errors only, always with an icon and words, so an error never reads as the brand.
Neutrals
Cool greys derived from Layl, for lines and secondary text. Lines carry no text, so they have no ratio.
- Line
--lineLines only - Strong line
--line-strongLines only - AaMuted text
--muted4.9:1AA on Milh - AaFaint text
--faint4.6:1AA on Milh - AaFayrouz text
--brand-ink5.4:1AA on Milh
Text pairs
The pairs the site sets text in, measured in both themes. In the dark theme the canvas is a deeper Layl, and Fayrouz, Shams and Nil lift so their text still passes.
| Pair | Hex | Contrast |
|---|---|---|
| AaLayl on Milh | #0e2b2f / #f1f4f3 | 13.5:1AAA |
| AaWhite on Layl (primary button) | #ffffff / #0e2b2f | 14.9:1AAA |
| AaWhite on the deep Fayrouz fill (peak night) | #ffffff / #0b6f67 | 6.0:1AA |
| AaFayrouz text on Milh | #0b6f67 / #f1f4f3 | 5.4:1AA |
| AaMuted text on Milh | #5b6d70 / #f1f4f3 | 4.9:1AA |
| AaLayl on Shams | #0e2b2f / #f2b33d | 8.0:1AAA |
| AaWhite on Nil | #ffffff / #2f5c9e | 6.7:1AA |
| AaWhite on Henna | #ffffff / #a65a0c | 5.1:1AA |
| AaWhite on Jamr (errors) | #ffffff / #b93a32 | 5.7:1AA |
| AaThe sample data badge | #8a5a12 / #fcf0d6 | 5.2:1AA |
| Pair | Hex | Contrast |
|---|---|---|
| AaText on the dark canvas | #e8eeed / #0a1f22 | 14.5:1AAA |
| AaFayrouz text on the dark canvas | #3fd1be / #0a1f22 | 9.0:1AAA |
| AaDark text on the dark theme’s peak fill | #0a1f22 / #3fd1be | 9.0:1AAA |
| AaShams text on the dark canvas | #f5be55 / #0a1f22 | 10.0:1AAA |
| AaNil text on the dark canvas | #7aa6ff / #0a1f22 | 7.1:1AAA |
Below, typical, above
Where a price sits in its market is a diverging scale: Nil below, a neutral for typical and Henna above. Every pin also shows its price as text, so colour is never the only cue.
- Well below6.7:1AAWell below7.1:1AAA
--band-1 - Below8.3:1AAABelow8.3:1AAA
--band-2 - Typical12.8:1AAATypical10.7:1AAA
--band-3 - Above7.4:1AAAAbove9.0:1AAA
--band-4 - Well above5.1:1AAWell above8.2:1AAA
--band-5
Price and demand heat
Intensity is a sequential ramp from white through Shams to Henna and dark Henna.
--heat-1--heat-2--heat-3--heat-4--heat-5--heat-6
QuietPeak
Type
Readex Pro stays: one variable family for everything, with Arabic and Latin designed together, under the SIL Open Font License 1.1.
Latin
Aa Bb Cc Jj Qq 0123456789
Know where your nights are heading.
Arabic
أ ب ج د ه و ز ح ط ي ك ل م ن
اعرف إلى أين تتجه لياليك.
Weights
- Aa أب400Body text
- Aa أب500Interface labels
- Aa أب600Headings and the wordmark
- Aa أب700Display only
Scale
Know where your nights are heading.
Know where your nights are heading.
Know where your nights are heading.
Know where your nights are heading.
Know where your nights are heading.
Setting text
- Latin display text is tracked −0.025 em. Arabic letters join, so Arabic tracking stays at zero.
- Body line height is 1.6 in Latin and 1.85 in Arabic; display is 1.1 and 1.35.
- Prices and counts use tabular figures and stay in Latin digits on Arabic pages, isolated so they read left to right.
- Lines stay under about 70 characters.
The line
The week line is the identity in use: the coming week’s rates as one line, as the homepage shows it for the visitor’s market.
- Sunday 25 October: SAR 395
- Monday 26 October: SAR 380
- Tuesday 27 October: SAR 385
- Wednesday 28 October: SAR 410
- Thursday 29 October: SAR 470
- Friday 30 October: SAR 545, the peak night, 33% above the week’s median
- Saturday 31 October: SAR 430
- The line is Fayrouz and is drawn only where it shows a real direction over time, never as decoration.
- Weekend nights share one Shams band: Thursday and Friday in most of the region, Friday and Saturday in the UAE.
- The peak night is the one filled dot, with its rate in a Fayrouz chip and how far it sits above the week’s median.
- The dashed line is the week’s median. The two dots after the week are the plan’s next two nights, where the line leads.
- In the calendar each night is a cell, slightly taller than wide, with an 8 px corner: weekend cells in Shams, the peak night in Fayrouz with ↑.
One region, many markets
StayTrend covers seven countries. Each market keeps its own weekend nights, its own currency where that currency has a fixed rate, and its own calendar.
- RiyadhWeekend nights: Thursday and FridayCollected in SAR
- DubaiWeekend nights: Friday and Saturday3.6725 AED per US dollar
- DohaWeekend nights: Thursday and Friday3.64 QAR per US dollar
- ManamaWeekend nights: Thursday and Friday0.376 BHD per US dollar
- Kuwait CityWeekend nights: Thursday and FridayStays in SAR: the Kuwaiti dinar has no fixed rate
- MuscatWeekend nights: Thursday and Friday0.3845 OMR per US dollar
- CairoWeekend nights: Thursday and FridayStays in SAR: the Egyptian pound has no fixed rate
Its own calendar
Holidays, school breaks, seasons and big events for every country, each with its source and whether its dates are official or expected. These are the next entries, from the calendar checked Oct 28, 2026.
- Saudi ArabiaRiyadh SeasonExpectedSource: gulfnews.com
- United Arab EmiratesSheikh Zayed FestivalExpectedSource: gulfnews.com
- QatarSchool mid-term breakExpectedSource: al-sharq.com
- BahrainIISS Manama DialogueExpectedSource: gdnonline.com
- KuwaitGulf Bank 642 MarathonOfficialSource: e-gulfbank.com
- OmanOman National Day holidayOfficialSource: omannews.gov.om
- EgyptCairo ICTOfficialSource: cairoict.com
Motion
Each page gets one orchestrated moment at most. On the homepage it is the week line, drawn from the first night to the last as the page loads; everything else moves only in answer to the visitor.
The homepage story
The homepage in four steps. Under reduced motion every step is simply in place.
- The week line drawsThe line runs from the first night to the last, each night’s dot and rate arriving as it passes, the peak last, then the two dots ahead.
- The month fills inBelow the hero, the month of night cells fills in row by row, each night a beat after the one before it.
- Sections enter with depthPanels lift from a slight tilt, rows slide in from the start side and bars grow, each settled a third of the way up the window.
- The Atlas board flattensDistrict circles lie on a tilted board with their price pins standing up, and the board turns to face the reader.
Everything else moves only in answer to the visitor: opening, expanding, confirming. Only transform and opacity animate, plus the line’s reveal, and with reduced motion everything is simply there.
| Token | Value | Use |
|---|---|---|
--dur-fast | 140ms | Hover and press feedback |
--dur-base | 220ms | Menus, toggles and small reveals |
--dur-slow | 360ms | Panels opening |
--dur-slower | 600ms | A panel settling into place |
--ease-out | cubic-bezier(.16, 1, .3, 1) | Entrances: a quick start and a soft landing |
--ease-standard | cubic-bezier(.2, 0, 0, 1) | Moves and resizes |
Product videos
A 30-second tour in English and Arabic, a vertical cut for stories and reels, and a silent 7.5-second loop. The week line is drawn first, then the product as it is: the Atlas in Riyadh, Dubai and Doha in their own currencies, choosing the comparables behind an estimate, the pricing calendar with every adjustment explained, the regional events calendar and the free-trial end card. Every price in them is sample data.
StayTrend in 30 seconds
See where your week is heading, see the competition on the map, choose the comparables behind an estimate, price every night and plan around the region’s holidays and events.
Read the transcript
- Know where your nights are heading.
- See every competing listing in your market, priced for your dates.
- Choose the comparables behind every revenue estimate.
- A rate for every night, with the reasoning shown.
- Holidays and events in seven countries, each with its source.
- Start free trial at staytrend.ai. 30-day free trial, no card needed.
Voice
Plain, specific and calm: say what a thing does, name the source and give the number.
- Arabic is a first-class language, written for Arabic readers rather than translated as an afterthought.
- No hype, such as “revolutionary” or “AI-powered”, and no apologies in errors.
- Never invent data. Sample figures are labelled as samples.
- An empty state tells the visitor what to do next.
- Sections open with a plain heading and one sentence: no all-caps or eyebrow labels, no strings of middle dots, no arrows after links and no single coloured word in a headline.
| Write | Instead of |
|---|---|
| Friday is the peak: 33% above the week’s median. | |
| No listings are tracked here yet. Search a nearby city in the Atlas. | |
| Asking prices from Gathern, collected today. |
Downloads
Every logo file, the app icons, the social cards and the product videos. Use SVG wherever you can.
Logos
| File | Download |
|---|---|
| Mark | SVGPNG |
| Mark, one colour | Black SVGWhite SVG |
| English lockup | SVGPNG |
| English lockup on dark | SVGPNG |
| English lockup, one colour | Black SVGWhite SVG |
| Arabic lockup | SVGPNG |
| Arabic lockup on dark | SVGPNG |
| Arabic lockup, one colour | Black SVGWhite SVG |
| Bilingual lockup | SVGPNG |
| Bilingual lockup on dark | SVGPNG |
| Stacked lockup | SVGPNG |
| Stacked lockup on dark | SVGPNG |
App icons and favicons
| File | Download |
|---|---|
 App icon | PNG 512PNG 192 |
 Maskable icon | PNG 512PNG 192 |
 Apple touch icon | PNG |
| Favicon | SVGICOPNG 32PNG 16 |
 Safari pinned tab | SVG |
Social cards
Englishالعربية
Englishالعربية
Englishالعربية
Englishالعربية
Englishالعربية
Englishالعربية
Englishالعربية
Englishالعربية
Market cards by country
Each country’s market pages share a card that names the currency they show: AED, QAR, BHD and OMR at the fixed rate, and SAR elsewhere.
Videos
Press
Writing about StayTrend? Get in touch for product details, screenshots or an interview.
About StayTrend
StayTrend is a short-term rental market data and dynamic pricing platform, starting with the Gulf and Egypt. It gives hosts, property managers and investors market maps, occupancy and revenue estimates, a recommended rate for every night and a data API.