Brand GuidelinesDesign System →RU/ENv1.0 · 2026
PepperReputation

Logo, colours, typography and graphic elements of Pepper Reputation.

01

Primary logo

The horizontal version is the default: website, documents, presentations, email signatures.

PepperReputation
02

Logo versions

Pick the version that fits the format. Proportions and the arrangement of elements never change.

PepperReputation
HorizontalPrimary
SVG ↓
PepperReputation
Two-lineNarrow areas, headers
SVG ↓
PepperReputation
StackedSquare formats
SVG ↓
IconAvatars, favicon, icons
SVG ↓
03

Colour versions

The colour version comes first. Monochrome versions are for one-colour print, embossing, engraving and backgrounds where the green gets lost.

PepperReputation
ColourOn light backgrounds
PepperReputation
ReverseOn dark backgrounds
PepperReputation
On brand greenThe icon turns white
PepperReputation
Mono blackThe arrow is a transparent knockout
PepperReputation
Mono whiteThe arrow is a transparent knockout
Icon on different backgroundsColour, on green, monochrome
04

Clear space and minimum size

Keep a clear space x around the logo equal to half the icon height. No text, layout edges or other logos inside it.

PepperReputation
x x x x
x = ½ icon height
PepperReputation
Logo: 24 pxPrint: 8 mm high
Icon: 16 pxPrint: 5 mm
05

Sizes

Icon and logo at actual size. Icon PNGs are for favicons, app icons and social media avatars.

16 px
24 px
32 px
48 px
64 px
96 px
128 px
24 px
PepperReputation
32 px
PepperReputation
48 px
PepperReputation
72 px
PepperReputation
Download icon PNG
06

Colours

The base is a warm light background and a deep forest green. Brand green is the accent: icon, buttons, result figures. Don't use it to fill large areas.

Paper 50%
Stone 20%
Forest 18%
Primary
Pepper Green#51B37F · RGB 81 179 127Icon, buttons, accent figures
Forest#012813 · RGB 1 40 19Dark blocks: results, CTA, closing slide
Ink#111219 · RGB 17 18 25Headings and body text
Paper#F8F7F4 · RGB 248 247 244Main website background and slide headers
Secondary
Green Text#0E8A4D · RGB 14 138 77Green text on light: eyebrows, links
Mint#62C38C · RGB 98 195 140Captions and eyebrows on Forest
Stone#E4E3E0 · RGB 228 227 224Slide work area background behind cards
Muted#6B6F7B · RGB 107 111 123Secondary text, captions, sources
White#FFFFFF · RGB 255 255 255Cards, form fields
07

Typography

Two type pairings: one for the website and interfaces, the other for presentations and print. Don't mix them in one medium. The logo wordmark is always Plus Jakarta Sans — place the logo as a file, never retype it.

Website and interfacesPlus Jakarta Sans · JetBrains Mono
The cost of poor reviews
Your reputation is your revenue pipeline

We work with companies on their online presence and turn reviews into a measurable part of growth.

H1Bold 700 · 42–61 px · −0.035em · 1.04
H2Bold 700 · 29–42 px · −0.03em · 1.08
CardBold 700 · 15–16 px · −0.02em
BodyRegular 400 · 16 px · 1.55
ButtonSemiBold 600 · 14–15 px · −0.01em
EyebrowJetBrains Mono 500 · 11 px · caps · +0.1em
Presentations and printOswald · Jost
02 · The evidence
Companies that manage it well

Volume and a rating in the green zone. Invitations go out to every customer and every review gets an answer.

HeadingOswald SemiBold 600 · 72–96 px*
FigureOswald SemiBold 600 · 64–120 px*
CardOswald Medium 500 · 40–48 px*
BodyJost Light 300 · 28–32 px* · 1.6
LabelJost Regular 400 · 20 px* · caps · +0.2em
EyebrowOswald SemiBold 600 · 22 px* · caps · +0.14em · Green Text
* for a 1920×1080 slide
08

Graphic elements

A small set of recurring devices. No gradients, shadows or illustrations: clean panels, thin lines, plenty of white space.

04 · The work
How we manage a profile
Eyebrow with section number“Number · Section”, all caps, green. Always above the heading.
Car rental agency SIXT car rental USA 8,006 reviews
CardWhite, 8 px radius, on Stone. #E4E3DE border only on light backgrounds.
Result A higher overall rating. Top of the category in a chosen region.
Forest dark blockFor summaries, results and calls to action. Labels in Mint, text in white.
—Connect and configure Trustpilot services.
—Remove fake reviews posted by competitors.
Dash listThe bullet is a green em dash, no dots or icons.
Duration3 months
ObjectiveRating in the green zone
“Label — value” tableThin dividers, all-caps label on the left, value in Oswald.
4·Pepper Reputation
Request your free audit →
Footer and buttonNumber · Pepper Reputation at the bottom of the slide. Button is green, 8 px radius, “→” arrow.
09

Slide layout

A slide has two zones: a light Paper header with eyebrow and heading, and a Stone or Forest work area. Margins are 7% of the slide width, everything is left-aligned.

02 · The evidenceCompanies that manage it
Content slidePaper header + Stone area with cards
05 · The next stepReady to get started?
Accent slidePaper header + Forest area: summary, plan, CTA
PepperReputation
Official Trustpilot partner
Let’s run the
first three months
One market, one pilot, a rating in the green zone.
Cover and closingLogo top left, large heading, Forest bottom area
10

Don'ts

PepperReputation
✕ Don't stretch or squash
PepperReputation
✕ Don't change the colours
PepperReputation
✕ Don't rotate
PepperReputation
✕ Don't place on low-contrast backgrounds