instap
Brand guidelines · v1

Visual identity

Instap brand

A single source of truth for the logo, colors, gradients and typography. Use these values when building consistent documents, presentations and marketing materials.

Colors

Brand palette

The three base colors come straight from the logo. Mint is the accent, violet is the dominant, blue ties them together in gradients. Neutrals (black, white, grays) carry context and typography.

Base colors

Instap Mint#00D8B3--instap-greenThe “life” accent — pulse, the dot in the logo, online and OK signals.
Instap Violet#8667FC--instap-violetThe primary brand color. Dominant in graphics, icons and accents.
Instap Blue#0E7BF7--instap-blueThe color of technology and data. Bridges mint and violet in gradients.

Gradient stops

The full range of colors found in the logo and UI gradients.

Mint#00D8B3
Cyan#1DB8FC
Blue#0E7BF7
Violet 300#A189FC
Violet 500#8667FC
Magenta#BB58FC

Neutrals

Black#000000Hero background, dark variant.
Gray 950#030712Primary text.
Gray 500#6B7280Secondary text, captions.
Gray 200#E5E7EBBorders, hairline rules.
Gray 50#F9FAFBSection backgrounds, light panels.
White#FFFFFFBase background, text on dark.

Gradients

Brand gradients

The gradient is Instap’s signature. Use the main gradient for accents and hero backgrounds; the mark gradients reproduce the exact logo colors.

Brand gradientThe main UI gradient (Gradient component). From mint through blue to magenta.linear-gradient(145deg, #00D8B3 28%, #0E7BF7 70%, #BB58FC 100%)
Logo — the “i” stemThe vertical element of the mark (drop / pulse).linear-gradient(180deg, #00D8B3, #0E7BF7)
Logo — the armThe diagonal arm of the mark.linear-gradient(150deg, #8667FC, #BB58FC)
Logo — main glyphThe diagonal from violet to blue.linear-gradient(150deg, #A189FC, #1DB8FC)

Typography

Typefaces

Two typefaces: Stack Sans Notch for headings (distinctive, technical) and Rajdhani for body (condensed, legible). Labels are set in uppercase with wide tracking.

Stack Sans Notch

Display — headings, wordmark, taglines.

token:
--font-display
weights:
400 · 500 · 600 · 700
Download (.ttf)

Medical-grade software systems

AaBbCcĄąĆ棳Śś 0123456789 — { } [ ] ( ) & @ # %

Rajdhani

Text — body copy, UI, buttons, labels.

token:
--font-sans
weights:
400 · 500 · 600 · 700
Download (.ttf)

Software for industries where there is no room for error.

AaBbCcĄąĆ棳Śś 0123456789 — { } [ ] ( ) & @ # %

Label / mono

Monospace, uppercase, wide tracking — used for eyebrows and meta labels (Subheading component).

Software house · Patient monitoring systems

Voice & tone

How Instap speaks

Instap is a software house for industries where there is no room for error — healthcare and industry. The communication is factual, technical and credible.

Do

  • Factual, concrete, free of marketing noise.
  • Technical language where the reader is an engineer or clinician.
  • Emphasis on data security, on-premise and reliability.

Avoid

  • Empty superlatives (“the best”, “revolutionary”).
  • Jargon that obscures (buzzwords with no substance).
  • Promises the deployment cannot back up.

For tools & agents

Tokens — quick reference

Canonical values to paste into documents, presentations and code. The definitions live in src/styles/tailwind.css and in the logo SVG.

/* Base colors */
--instap-green:  #00D8B3;   /* mint / pulse */
--instap-violet: #8667FC;   /* dominant */
--instap-blue:   #0E7BF7;   /* technology */

/* Gradient stops */
mint #00D8B3 · cyan #1DB8FC · blue #0E7BF7
violet-300 #A189FC · violet-500 #8667FC · magenta #BB58FC

/* Brand gradient */
linear-gradient(145deg, #00D8B3 28%, #0E7BF7 70%, #BB58FC 100%);

/* Typography (self-hosted: public/fonts/*.ttf) */
--font-display: "Stack Sans Notch";  /* headings, wordmark */
--font-sans:    "Rajdhani";          /* body, UI */

/* Assets */
logo:  /instap/instap-logo-violet.svg
png:   /instap/png/instap-mark-{color|white|dark}-{16..1024}.png
fonts: /fonts/{rajdhani|stack-sans-notch}-{400|500|600|700}.ttf

/* Wordmark */
instap   /* always lowercase */

Asset index

All files & links

Every downloadable asset with its direct path. The link text is the public URL itself, so it can be read and reused directly.

Logo — PNG, transparent background24