Brand Hub
Refari Brand Hub

Online reputation management for recruiters.

The verified-review tick, Persian Rose into Sea Serpent, and a full asset pack: everything you need to put the TopRec brand to work correctly.

Logo

The TopRec logo

Primarily typographic, with the “Uplift Arrow” inside the R signifying the impact TopRec has on businesses. Keep clear space around it (use the height of “TOP”), and never recolour, stretch or rebuild it.

TopRec logo on light
Colour · on light
TopRec logo on dark
White · on dark
TopRec logo on gradient
White · on gradient
Download all assets (ZIP) Browse individual files
Motion

The verified tick

TopRec is built on trust. When a review is independently verified, this green tick animates in — the signal of a genuine top recommendation. Use it wherever you mark a verified review.

Verified tick
The exact testimonials-widget tick (ring + check, #27AE60) · animated + static SVG
Animated Static

How it animates

  • Runs on a 3 second loop: it pops in (scale, about 0.25 s), the ring draws (by ~0.6 s), then the check draws (by ~1 s), holds, scales out and repeats.
  • Colour is fixed at #27AE60, with a faint 12% fill inside the ring (the soft green background).
  • Use it only for an independently-verified review (a genuine top recommendation).
  • Default size is 18 px; scales cleanly from 16 px up.
  • Respects reduced-motion (shows the tick static).

Don't

  • Don't recolour, stretch or skew it.
  • Don't change the timing so it feels frantic.
  • Don't use it decoratively, or on reviews that aren't verified.

This is the exact AnimatedTick from the Svelte V2 testimonials widget. A plain version without the green background ring can be added if you want one.

Colour

Colour palette

Persian Rose and Sea Serpent lead, carried by Charcoal and the neutrals. Click any swatch to copy its HEX.

Core

Copy HEX

Persian Rose

HEX #FF2CA8 · RGB 255 44 168

Copy HEX

Sea Serpent

HEX #49BED9 · RGB 73 190 217

Copy HEX

Charcoal

HEX #3C4856 · RGB 60 72 86

Supporting

Copy HEX

Black

HEX #000000 · RGB 0 0 0

Copy HEX

White

HEX #FFFFFF · RGB 255 255 255

Copy CSS

Signature gradient

linear-gradient(90deg, #FF0A95, #5EE0F0)

Typography

Typefaces

Lato sets headlines; Source Sans Pro carries body copy — the shared type system across the Refari family. Both are free from Google Fonts.

Headings

Lato

Black 900 & Bold 700

Aa Bb Cc
TopRec

Black 900Bold 700Regular 400

Body

Source Sans Pro

Regular 400 & Semibold 600

A practical, friendly sans for everything from long-form copy to interface text — clear at any size.

Semibold 600Regular 400Light 300
<!-- Embed both typefaces (Google Fonts) -->
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700&display=swap" rel="stylesheet">
Downloads

Asset library

The vector logo (SVG) stays sharp at any size — prefer it where you can. Need everything at once? Grab the full pack.

Download full pack — toprec-brand-assets.zip · 1.1 MB

Logo

TopRec colour logo on light
Logo — Colour
Vector · for light backgrounds
SVG PNG
TopRec white logo on dark
Logo — White
For dark backgrounds
PNG
TopRec black logo
Logo — Black
Single-colour / mono use
PNG

Icon — “TOP” + the uplift-arrow R

TopRec app icon on gradient
Icon — on gradient
App icon, avatars, tiles
PNG
TopRec colour icon on white
Icon — Colour on white
For light backgrounds
PNG
TopRec colour icon on dark
Icon — Colour on dark
For dark backgrounds
PNG
TopRec black icon on white
Icon — Black on white
Single-colour / mono use
PNG

Colour reference

TXT
Colour values
HEX, RGB and usage notes
TXTCSS
Source & formats

Editable source & other formats

The SVGs above cover most needs. To edit the artwork or for print, start with the Adobe Illustrator source. Other working files are in the appendix below.

AI
Logo — Adobe Illustrator
Editable vector source (.ai), the master artwork
224 KB Download .ai

Appendix — other formats

PSD
Icon template (Photoshop)
Editable icon artwork (.psd)
4.8 MB PSD
PDF
Brand guidelines (one-pager)
Logo, colour, type and usage
3.3 MB PDF