Amply

Brand Guidelines

Contents

01 Brand Overview 3
02 The Wordmark 4
03 Clear Space & Sizing 5
04 Color Palette 6
05 Typography 7
06 Usage Guidelines 8
07 Incorrect Usage 9
08 Implementation 10

2

01 Brand Overview

Amply is an ultra-transparent donation platform where every cent is traceable. Our visual identity reflects this commitment to clarity, accessibility, and trust.

Our Mission

We believe charitable giving should be completely transparent. Amply provides the infrastructure for donors to see exactly where their money goes, and for organizations to demonstrate their impact with verifiable data.

Brand Principles

Accessible by Default

Every design choice considers all users. Our typography was selected for optimal readability, and our colors meet WCAG accessibility standards.

Clarity Over Decoration

We favor functional design over ornamental flourishes. Every element serves a purpose. This mirrors our operational philosophy: substance over style.

Trust Through Transparency

Visual honesty matches operational honesty. We don't hide behind complexity or jargon. Our brand is as open as our platform.

Positioning: Guided by ideals. Grounded in reality.

3

02 The Wordmark

The Amply logo is a wordmark—the name set in Lexend Black (900). Simple, bold, and instantly recognizable.

Amply

Primary Versions

Use the appropriate version based on background color to ensure optimal contrast and legibility.

Amply

Primary Amply Teal on white or light backgrounds

Amply

Reversed White on Amply Teal backgrounds

Amply

Dark Mode White on dark backgrounds

Amply

Monochrome Dark gray for single-color applications

Note: Never recreate the wordmark manually. Always use official assets or render using Lexend Black at the correct specifications.

4

03 Clear Space & Sizing

Clear Space

Maintain adequate space around the wordmark to ensure visibility and impact. The minimum clear space equals the cap height of the letter "A".

Amply

Minimum clear space = 1× cap height of "A"

Minimum Size

To maintain legibility across all applications, observe these minimum sizes:

Amply Large (48pt+)

Amply Medium (24pt)

Amply Minimum (15pt / 20px)

Application	Minimum Size	Notes
Digital (screen)	`20px`	Favicons may use simplified mark
Print	`15pt` (~5mm height)	Ensure sufficient DPI (300+)
Merchandise	`10mm` height	Production method dependent

5

04 Color Palette

Amply Teal conveys trust and clarity. Amply Coral adds warmth and energy. Together, they balance professionalism with approachability.

Amply

Amply Teal — Primary

#05668D · RGB 5, 102, 141 · HSL 197°, 93%, 29% · CMYK 96, 28, 0, 45

Amply Coral — Secondary

#F98152
RGB 249, 129, 82
CTAs, accents, highlights

Amply Dark

#044a66
RGB 4, 74, 102
Hover states, depth

Amply Light

#e8f4f8
RGB 232, 244, 248
Backgrounds, fills

White

#FFFFFF
Primary background,
reversed wordmark

Accessibility

Combination	Contrast Ratio	WCAG Level
Amply Teal on White	`6.4 : 1`	AA (normal text), AAA (large text)
White on Amply Teal	`6.4 : 1`	AA (normal text), AAA (large text)
Amply Dark on White	`8.9 : 1`	AAA (all text)
Amply Coral on White	`2.5 : 1`	Large elements only (buttons, icons)

Colors in Action

Amply

Teal wordmark

Donate Now

Coral CTA

Coral usage: Due to lower contrast, use Amply Coral for accent elements (buttons, icons, highlights) rather than body text. Pair with teal for text labels.

6

05 Typography

Lexend is our primary typeface—designed specifically for reading accessibility. It reduces visual stress and improves reading performance for everyone.

Type Scale

Display Thin 100

Transparent Giving

Headline ExtraLight 200

Every Cent Traceable

Subhead Light 300

Building Trust Through Transparency

Body Regular 400

Amply provides the infrastructure for transparent charitable giving.

UI / Labels Medium 500

Donate Now · View Impact · Learn More

Wordmark Black 900

Amply

Weight Reference

Weight	Value	Usage
Thin	`100`	Hero headlines, display text
ExtraLight	`200`	Section headlines
Light	`300`	Subheadings
Regular	`400`	Body text, paragraphs
Medium	`500`	Emphasis, UI labels
SemiBold	`600`	Buttons, navigation
Bold	`700`	Strong emphasis
Black	`900`	Wordmark only

7

06 Usage Guidelines

Select the appropriate wordmark version based on background to ensure optimal contrast and brand consistency.

On Solid Backgrounds

Amply

Teal on white

Amply

Teal on light gray

Amply

White on teal

Amply

White on coral (accent contexts)

Amply

White on dark

On Photography & Imagery

Amply

White on warm tones

Amply

White on cool tones

Amply

White on vibrant imagery

Amply

Teal on light imagery

Tip: When placing the wordmark on photography, ensure sufficient contrast. Use a semi-transparent overlay if needed, or position over less busy areas.

8

07 Incorrect Usage

To maintain brand integrity, avoid these common mistakes when using the Amply wordmark.

Amply

Don't stretch horizontally

Amply

Don't stretch vertically

Amply

Don't rotate

Amply

Don't use other fonts

Amply

Don't use other weights

Amply

Don't use unapproved colors

Amply

Don't add drop shadows

Amply

Don't outline the text

Amply

Don't apply gradients

Additional Guidelines

Never

Place on low-contrast backgrounds
Add decorative elements or icons
Animate or distort the wordmark
Use as part of a sentence
Recreate with different typography

Always

Use official assets or exact specs
Maintain minimum clear space
Ensure adequate contrast (4.5:1+)
Respect minimum size requirements
Keep proportions intact

9

08 Implementation

Technical specifications for implementing Amply brand elements in digital products.

Loading Lexend

<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap" rel="stylesheet">
      

CSS Variables

:root {
  /* Colors */
  --amply-teal: #05668D;
  --amply-coral: #F98152;
  --amply-dark: #044a66;
  --amply-light: #e8f4f8;

  /* Typography */
  --font-family: 'Lexend', sans-serif;
  --font-weight-thin: 100;
  --font-weight-extralight: 200;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-black: 900;
}
      

Wordmark Component

.amply-wordmark {
  font-family: var(--font-family);
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--amply-teal);
}

.amply-wordmark--reversed {
  color: #ffffff;
}
      

Quick Reference

Element	Specification
Primary Color	`#05668D` (Teal)
Secondary Color	`#F98152` (Coral)
Font Family	`Lexend`
Wordmark Weight	`900 (Black)`
Letter Spacing	`-0.02em`
Min Digital Size	`20px`
Min Print Size	`15pt / 5mm`

Questions? Contact hello@amply-impact.org for asset requests, co-branding guidelines, or usage approval.

10