> For the complete documentation index, see [llms.txt](https://docs.stayonhire.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.stayonhire.com/brand-kit/assets.md). # Brand Assets & Guidelines Welcome to the official brand kit for StayOnHire. These assets ensure our documentation remains consistent with our core platform. ## Visual Identity StayOnHire uses a high-visibility, industrial-professional aesthetic. The goal is to blend the reliability of the construction sector with the clean efficiency of a modern SaaS platform. StayOnHire positions itself as a modern, efficiency-driven partner for the construction and equipment rental industry. The brand identity balances technological innovation (bright, active colors) with industrial reliability (dark, grounded foundations). The overall aesthetic is "Clean SaaS" — minimizing clutter to focus on data and action. ## Logos {% hint style="info" %} **Usage guidelines - please read** When applying the StayOnHire logo please follow these simple rules: * Stick to StayOnhire brand colors * Scale the logo uniformly * Ensure the logo is legible (re. size and surrounding space) * Don't skew or rotate the logo {% endhint %} ### Wordmark Use the logos with green whenever possible. Use the other logos only when background colors or patterns would interfere with the full color primary logo. {% tabs %} {% tab title="GREEN + WHITE " %}

{% endtab %} {% tab title="GREEN + BLACK" %}

{% endtab %} {% tab title="WHITE" %}

{% endtab %} {% tab title="BLACK" %}

{% endtab %} {% endtabs %} {% tabs %} {% tab title="GREEN + WHITE " %}

{% endtab %} {% tab title="GREEN + BLACK" %}

{% endtab %} {% endtabs %} ### Mark Use these logos only when background colors or patterns would interfere with the full color primary logo. {% tabs %} {% tab title="GREEN + WHITE " %}

{% endtab %} {% endtabs %} {% tabs %} {% tab title="GREEN + WHITE " %}

{% endtab %} {% endtabs %} ### Icon Use these logos only when background colors or patterns would interfere with the full color primary logo or when you will be providing the cropping. {% tabs %} {% tab title="GREEN + WHITE " %}

{% endtab %} {% endtabs %} {% tabs %} {% tab title="GREEN + WHITE " %}

{% endtab %} {% endtabs %} {% tabs %} {% tab title="GRADIENT" %} * Acheived via a linear gradient from the top-right to the bottom-left' * \#48BE14 - 100% opacity - 25% from the bottom left * \#A8DC19 - 100% opacity - 100% top right

Visualisation of how gradient is achieved

{% endtab %} {% endtabs %} ### Splash Background Vector Use this vector when scaling splash screens as the logo background. This contrast compliments the green, white and main user interface elements of StayOnHire's apps. {% tabs fullWidth="false" %} {% tab title="SPLASH VECTOR" %}

Contrast white, green and StayOnHire's user interface

{% endtab %} {% tab title="PORTRAIT EXAMPLE" %}

{% endtab %} {% tab title="LANDSCAPE EXAMPLE" %}

{% endtab %} {% endtabs %} ## Colours #### Main palette **Website & Marketing (The "Brand" Face)** The marketing identity is designed to be high-energy and authoritative, utilizing a vibrant Action Green hero section to signify growth and operational efficiency. We prioritizes high-contrast typography and clear call-to-actions, such as the Website Primary Action Button (#2D75FF), to guide potential users toward conversion.

Example: Primary action buttons and H1 text

		Cover image
#2D75FF Website Primary Action	Usage: Primary call-to-action buttons, logo icon, success states, and highlighting key value propositions.	Website - Primary Action buttons 2D75FF.svg

**App & Software (The "Utility" Face)** The software interface shifts toward a 'Utility First' philosophy, prioritizing data density and long-term legibility. The color palette transitions to a grounded Deep Slate sidebar for navigation, while the main workspace uses a clean Canvas Grey background to reduce eye strain during extended use. To manage complex scheduling, the app utilizes a secondary palette of muted pastels for Gantt chart 'job blocks,' ensuring that status indicators and text remain clear and actionable without overwhelming the user.

Example: Action buttons in top right, alongside calendar colour events

		Cover image
#186ACC APP Primary Action Buttons	Usage: Primary call-to-action buttons, logo icon, success states, and highlighting key value propositions.	Website - Primary Action buttons 2D75FF.svg
#E8F0FA APP Secondary Action Buttons	Usage: Secondary call-to-action buttons	Website - Primary Action buttons 2D75FF-1.svg
#D8D8D8 - Fill #BDBDBD - Border	Usage: Job and calendar event colour	SILVER 2.svg
#B1D4FC - Fill #81B8FA - Border	Usage: Job and calendar event colour	BLUE 2.svg
#75D1F0 - Fill #52C4EB - Border	Usage: Job and calendar event colour	LIGHT BLUE 2.svg
#62DAC0 - Fill #46D2B4 - Border	Usage: Job and calendar event colour	TURQUOISE 2.svg
#90E098 - Fill #6FD679 - Border	Usage: Job and calendar event colour	GREEN 2.svg
#FFDA8F - Fill #FFCA63 - Border	Usage: Job and calendar event colour	YELLOW 2.svg
#FFB79D - Fill #FF946F - Border	Usage: Job and calendar event colour	ORANGE 2.svg
#FFBCCC - Fill #FF88A4 - Border	Usage: Job and calendar event colour	PINK 2.svg
#FFBAE8 - Fill #FF87D6 - Border	Usage: Job and calendar event colour	LIGHT PINK 2.svg
#E4D1FD - Fill #C49DFA - Border	Usage: Job and calendar event colour	PURPLE 2.svg

## Typography **Website & Marketing (The "Brand" Face)**

https://fonts.google.com/specimen/Montserrat

* *Font:* Montserrat * *Characteristics:* Rounded, friendly, and modern. It makes the "heavy" industry topics feel accessible and easy to manage. * *Usage:* Hero banners ("Streamline Operations"), feature titles, and major announcements. **App & Software (The "Utility" Face)**

* Interface Font: Inter or Roboto. * *Why:* These fonts are designed specifically for user interfaces. They have a tall x-height, making them legible at small sizes (like in the sidebar or Gantt chart tags in your screenshot) and handle numbers/data very well. * *Usage:* All text inside the login portal, dashboards, and data tables. ## Tone of Voice **Voice: The "Efficient Partner"** StayOnHire speaks like a knowledgeable project manager. We understands the chaos of construction/rental and offers a calm, organized solution. * Direct: Uses active verbs (*Streamline, Manage, Organise*). Avoids flowery language. * Solution-Oriented: Focuses on the *outcome* (saving time, reducing error) rather than just the features. * Professional yet Accessible: It avoids overly complex jargon, making the software feel inviting to users who might be used to pen-and-paper methods. **Tone Guidelines** * Do: Be clear, concise, and encouraging. * *Example:* "Organize your business. Execute jobs and projects." * Don't: Be playful, whimsical, or overly aggressive. * *Avoid:* "Crush the competition!" or "The coolest app for hire." **Key Brand Messaging Pillars** * Simplicity: "Migrate off spreadsheets." * Control: "Prevent double-bookings." * Scale: "Scale fleets and labour."