Brand

PEPTPlus brand style guide

One reference for the PEPTPlus brand system: the logo, the color palette, the type scale, the core UI components, and the voice we write in. Every value below is taken straight from the product design kit so the marketing site and the app stay consistent.

Logo

The wordmark is a single SVG asset, /pept-plus-logo.svg. On dark surfaces it is knocked to solid white with a CSS filter rather than a separate file, so there is one source asset to maintain.

On light

On green

Do

Keep clear space around the mark equal to at least the height of the letter P on all sides.
Use the full color mark on light backgrounds and the white mark on dark or green backgrounds.
Scale the SVG so it stays crisp at any size.

Do not

Stretch, squash, or rotate the mark.
Recolor it outside the two approved treatments.
Add drop shadows, outlines, gradients, or other effects.
Place the full color mark on a low contrast background where it is hard to read.

Color palette

The palette is deliberately restrained: two greens carry the brand, a warm tan accents, and a small neutral set handles everything else. Swatches render from the exact token values.

Primary

Green#1f7a3a--greenPrimary brand green. Buttons, links, active states.

Green dark#155c2b--green-darkHover and pressed states, footer, dark panels.

Neutrals

Ink#2c3530--inkDefault text color.

Muted#6b766f--mutedSecondary text, labels, captions.

Background#f4f7f4--bg-bottomPage background.

Border#d8e0da--borderCard and input borders, dividers.

Grey 100#f2f4f2--grey-100Hover fills, subtle row separators.

Accent

Tan#c9a878--tanAccent for secondary button borders and small highlights.

Semantic

Error#c0392b--errValidation errors, destructive actions.

Success fillrgba(31,122,58,.08)--success-bgSoft green background for success chips and badges.

Gradients

The brand uses a small set of green gradients for full width bands. Each combines a soft radial highlight over a diagonal green base. Every recipe below is the exact background value used in the marketing CSS.

Hero band (dark)Dark green hero sections. Source: .cmp-hero.

radial-gradient(120% 170% at 12% -20%, rgba(87,212,147,.18), transparent 52%), linear-gradient(120deg, #14532a 0%, #0f4322 55%, #0a3319 100%)

Call-to-action bandClosing CTA panels. Source: .cmp-final-band.

radial-gradient(150% 210% at 88% -45%, rgba(87,212,147,.24), transparent 55%), linear-gradient(120deg, #1f7a3a 0%, #155c2b 55%, #0e4522 100%)

Stats band (inverted)Full width stats strip. Source: .stats-band.

radial-gradient(120% 170% at 12% -20%, rgba(255,255,255,.13), transparent 52%), linear-gradient(120deg, #1f7a3a 0%, #155c2b 60%, #0e4522 100%)

Soft section backgroundLight section washes. Source: .features, .cmp-why.linear-gradient(180deg, #eef6f0 0%, #e6f1ea 100%)

Typography

One typeface across the whole product: Poppins, with a system sans fallback. The stack is 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif. Headings use weight 600, body text weight 400, and light captions weight 300.

PEPTPlus brand style guide

H1 1.9rem, weight 600, letter-spacing -0.01em

Section heading

H2 1.15rem, weight 600

Subsection heading

H3 1.05rem, weight 600

Body copy sets at a 1.5 line height for comfortable reading. It stays plain and factual, and it never uses a dash where a comma or colon will do.

Body 1rem, weight 400, line-height 1.5

Captions and labels sit lighter and smaller.

Caption 0.85rem, weight 300

Buttons and UI

Buttons are fully pill shaped using the --radius-pill token (999px). Cards use --radius-card (18px) and inputs use --radius-input (12px). The kit ships three button treatments.

.btn-primary: solid green fill, white text, used for the main action on a screen.
.btn-secondary: transparent with a tan border, fills green on hover, used for secondary actions.
.btn-sm: the compact size modifier, layered on either treatment.

--radius-pill 999px

--radius-card 18px

--radius-input 12px

Voice and tone

Neutral is the core brand idea, in the palette and in the words. PEPTPlus does not take a cut of drug dollars; the platform runs on a flat fee, with $0 earned on the price of the medication itself. We write like that: plain, factual, and free of hype.

Neutral positioning

Lead with the flat fee and the $0 on the drug. State what the platform does and does not do, without spin.

Factual claims only

Every present-tense claim must be true today. Anything still in progress is labeled as such, with a date.

No unverifiable superlatives

Skip "best", "leading", and "revolutionary" unless there is a source to back it. Let the specifics carry the weight.

Punctuation rule: no em or en dashes

This is a house rule, and it is part of the brand voice. User facing copy never uses an em dash or an en dash. Use a comma, a colon, or a semicolon instead, or split the sentence in two. Hyphenated words like flat-fee are fine.

We sayWe avoid

Flat fee per order, with $0 on the drug.The best pricing in the industry.

EPCS certification is in progress, expected July 2026.Fully certified for controlled substances.

Prescriptions route only to pharmacies licensed for the patient's state.Route prescriptions anywhere, instantly.

A flat fee, so incentives stay neutral.A flat fee, joined to the next clause with an em dash.

Building with the PEPTPlus brand?

Use the tokens and specimens above so anything you ship matches the rest of the product.

See our security posture