Every asset. Every format.
One click.

Download logos as SVG, PNG or JPG at any size. Copy colors as HEX, RGB, HSL or CSS. Grab fonts, tokens, templates. Everything the practice ships — instantly usable.

Logo Library

7 files · SVG native · PNG/JPG on demand

Click any download button to grab the SVG instantly, or hit "PNG…" to pick a size + background. Every logo scales without loss.

Color Palette

6 swatches · click any code to copy
Bulk Actions

Type System

3 families · Google Fonts · Free forever

All three families are on Google Fonts. Grab the import snippet, copy the CSS stack, or open the Google Fonts page to download the .ttf/.woff2.

Display · Serif
Playfair Display · 5 weights
Aa
Regular · Scripture Semibold · Subheads Bold · Headlines Extrabold · Hero Italic · Emphasis
Body · Sans-Serif
Inter · 5 weights
Aa
Light · Fine print Regular · Body copy Medium · Emphasis Semibold · UI Bold · CTAs
Accent · Monospace
IBM Plex Mono · 3 weights
Aa
Regular · Metadata Medium · Stats Semibold · Tags & labels

Templates & Documents

13 assets · Live HTML · Print to PDF

Open any template to view/edit. Everything prints beautifully to PDF via Cmd/Ctrl+P.

Design Tokens

CSS · Tailwind · SCSS · JSON

Paste-ready code snippets for every stack. The palette, the type, the spacing scale, the radius scale — pick your format.

CSS Custom Properties
/* The Contracting Preacher — Design Tokens */
:root {
  /* Colors */
  --navy: #0A1628;
  --gold: #C9A961;
  --gold-dark: #B08D3F;
  --gold-light: #E4CB92;
  --ivory: #F7F3EA;
  --red: #8B1F1F;
  --slate: #4A5568;

  /* Type */
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans:  'Inter', system-ui, sans-serif;
  --font-mono:  'IBM Plex Mono', ui-monospace, monospace;

  /* Scale (4pt base) */
  --sp-xs: 4px;   --sp-sm: 8px;
  --sp-md: 16px;  --sp-lg: 24px;
  --sp-xl: 32px;  --sp-2xl: 48px;
  --sp-3xl: 64px; --sp-4xl: 96px;
}
Tailwind Config Extension
// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        tcp: {
          navy: '#0A1628',
          gold: '#C9A961',
          'gold-dark': '#B08D3F',
          'gold-light': '#E4CB92',
          ivory: '#F7F3EA',
          red: '#8B1F1F',
          slate: '#4A5568',
        }
      },
      fontFamily: {
        serif: ['Playfair Display', 'Georgia', 'serif'],
        sans:  ['Inter', 'system-ui', 'sans-serif'],
        mono:  ['IBM Plex Mono', 'monospace'],
      }
    }
  }
}
SCSS Variables
// _tokens.scss
$navy:       #0A1628;
$gold:       #C9A961;
$gold-dark:  #B08D3F;
$gold-light: #E4CB92;
$ivory:      #F7F3EA;
$red:        #8B1F1F;
$slate:      #4A5568;

$font-serif: 'Playfair Display', Georgia, serif;
$font-sans:  'Inter', system-ui, sans-serif;
$font-mono:  'IBM Plex Mono', monospace;
JSON (Style Dictionary / Figma Tokens)
{
  "color": {
    "navy":    { "value": "#0A1628" },
    "gold":    { "value": "#C9A961" },
    "ivory":   { "value": "#F7F3EA" },
    "red":     { "value": "#8B1F1F" },
    "slate":   { "value": "#4A5568" }
  },
  "font": {
    "serif": { "value": "Playfair Display" },
    "sans":  { "value": "Inter" },
    "mono":  { "value": "IBM Plex Mono" }
  }
}

Practice Info

Copy any field · use anywhere
Copied