Back to home

Brand guidelines

Logos, colors, spacing, and usage rules for ServicePulse. Assets are SVG for crisp scaling; use them in presentations, partner pages, and press kits.

Logo & logomark

Download assets

Logomark (app icon)

Default mark: blue tile with white pulse line. Use for favicons, app icons, and avatars.

servicepulse-logomark.svg
Download SVG

Logomark (monochrome line)

Pulse line only on transparent background. Use when the blue tile is not needed.

servicepulse-logomark-mono.svg
Download SVG

Logo — horizontal, dark background

Full lockup with light wordmark. For slate/navy headers, footers, and dark UI.

servicepulse-logo-horizontal-dark-bg.svg
Download SVG

Logo — horizontal, light background

Full lockup with dark wordmark. For white or light gray backgrounds.

servicepulse-logo-horizontal-light-bg.svg
Download SVG

Clear space

Keep the area around the logomark or full logo free of text, busy patterns, and other marks. As a rule of thumb, use padding equal to one quarter of the mark height on every side (for the 32px icon, at least 8px clear space). For the horizontal logo, use half the mark height above and below the lockup.

Dashed box illustrates minimum breathing room — do not place elements inside this zone.

Colors

Primary

#2563eb

Tailwind: blue-600

Buttons, links, logomark tile, primary actions

Primary hover

#3b82f6

Tailwind: blue-500

Interactive hover states

Marketing dark bg

#020617

Tailwind: slate-950

Hero and footer backgrounds

Body on dark

#f1f5f9

Tailwind: slate-100

Primary text on dark sections

Muted on dark

#94a3b8

Tailwind: slate-400

Secondary text, captions

Body on light

#0f172a

Tailwind: slate-900

Headings and text on white / light gray

Typography

The marketing site and product use the system UI stack: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif. SVG wordmarks use the same stack so they align with the live product when rendered in a browser.

For print or contexts without system fonts, substitute a neutral grotesk (e.g. Inter, Helvetica Neue) and match weight 700 for the wordmark.

Please don't

  • Stretch, skew, or rotate the logo or logomark.
  • Change the blue tile or pulse line to unapproved colors (see palette above).
  • Place the white-on-blue mark on busy backgrounds without enough contrast.
  • Add drop shadows, outlines, or effects that alter the mark's shape.
  • Use the pulse line alone in a color other than white (on blue) or brand blue (#2563eb) on light backgrounds.
  • Imply endorsement or partnership without permission.

Questions? Contact support