Contractor Company Branding & White-Label

Branding Overview

9:41

Branding

Summit Roofing Co.

Akron, Ohio · Est. 2019

72%

Complete

Brand Completeness

Add typography and email template to reach 100%

Company Logo

Uploaded

Brand Colors

3 set

Typography

Not set

Email Templates

Custom

Invoice Branding

Partial

Quick Actions

Edit Colors & Typography

Update your brand palette

Customize Templates

Emails, invoices, proposals

Export Brand Kit

Business cards, signatures, assets

BrandingOverviewScreen

useQuery(api.branding.queries.getBrandProfile), score ring with conic-gradient, checklist maps brand fields to completion status

Logo Upload

9:41

Company Logo

Preview

Light

Dark

Colored

Auto-crop detected extra whitespace. Tap to apply optimized crop.

Upload New Logo

Drag & drop or tap to browse

Requirements

Minimum 512 x 512px

Square or landscape preferred

PNG, SVG, or WebP

Transparent background recommended

Max 5 MB file size

Optimized on upload

LogoUploadScreen

expo-image-picker, useMutation(api.branding.mutations.uploadLogo), auto-crop via sharp/canvas, bg toggle previews logo on light/dark/colored surfaces

Color Theme

9:41

Brand Colors

Your Palette

Primary

#1E3A5F

Secondary

var(--terracotta)

Accent

var(--warning)

Quick Presets

Live Preview

Primary Button

Secondary

Summit Roofing Co.

Accent CTA

ColorThemeScreen

useMutation(api.branding.mutations.updateColors), color presets from COLOR_PRESETS array, live preview renders mock card/button/header with selected palette

Typography

9:41

Typography

Font Family

Inter

Clean, modern sans-serif

Merriweather

Classic serif for authority

Poppins

Bold geometric sans-serif

Weights

Regular

Medium

Semibold

Bold

Scale Preview

Heading

Summit Roofing

Subheading

Trusted Professionals

Body

We provide comprehensive roofing solutions for residential and commercial properties across Summit County.

Caption

Licensed & Insured · BBB A+ Rated

TypographyScreen

useMutation(api.branding.mutations.updateTypography), Google Fonts API for family selection, weight chips toggle included weights, live scale preview renders heading/body/caption samples

Email Templates

9:41

Email Templates

Estimate

Invoice

Follow-up

Summit Roofing Co.

Your Estimate is Ready

Hi {{first_name}},

Thank you for requesting an estimate. We have prepared a detailed proposal for your {{project_type}} project at {{address}}.

Project Total $8,450.00

View Full Estimate

Customize

Header Style

Logo + company name

Footer Content

Contact info, social links

Color Override

Uses brand palette by default

Merge Tags

{{first_name}} {{last_name}} {{project_type}} {{address}} {{estimate_total}} {{company_name}} {{rep_name}} {{schedule_date}}

EmailTemplatesScreen

useQuery(api.branding.queries.getEmailTemplates), tab selector for template type, merge tag chips insert at cursor, SendGrid integration for test sends

Invoice Branding

9:41

Invoice Branding

Summit Roofing Co.

1234 Main St, Akron, OH 44311
(330) 555-0142 · info@summitroofing.com

INVOICE

#INV-2026-0047
Feb 24, 2026

Description Amount

Roof Tear-Off & Disposal $2,800

GAF Timberline HDZ Shingles $4,200

Ridge Vent + Flashing $1,450

Total Due $8,450.00

Customization

Logo Placement

Top-left (default)

Active

Color Scheme

Uses brand primary

Custom Footer Text

Terms & Conditions

All work warranted for 10 years. Materials carry manufacturer warranty. Payment via check, ACH, or credit card.

Edit Terms

InvoiceBrandingScreen

useQuery(api.branding.queries.getInvoiceSettings), live preview applies brand colors to invoice mock, custom footer/terms fields persist to invoice generation

Public Profile Preview

9:41

Brand Preview

Profile

Bid Card

Portfolio

As Homeowners See You

Summit Roofing Co.

Roofing · Siding · Gutters

4.9 (127 reviews)

Verified Licensed Top Pro

Bid Card Appearance

Summit Roofing Co.

4.9 · 127 jobs

$8,450

Estimated

View Proposal

Message

Portfolio Header

Summit Roofing Co.

42 completed projects

BrandPreviewScreen

useQuery(api.branding.queries.getBrandProfile), three preview tabs (profile/bid/portfolio), renders live brand colors + logo into homeowner-facing mock components

Brand Assets Export

9:41

Brand Assets

Your Branded QR Code

Links to your public profile with brand colors

PNG

SVG

Downloadable Assets

Business Card Template

Front + Back · PDF · Print-ready

Email Signature

HTML + Image · Gmail / Outlook

Social Media Kit

FB, IG, LinkedIn · 6 templates

Letterhead Template

PDF + DOCX · Branded header/footer

Door Hanger

Front + Back · PDF · Print-ready

Vehicle Wrap Template

AI + PDF · Standard van/truck

ZIP archive · ~12 MB

BrandAssetsScreen

useQuery(api.branding.queries.getExportableAssets), QR code via react-native-qrcode-svg with brand overlay, asset generation via Convex action + Puppeteer server-side rendering

Data Architecture

Schema Tables

contractorProfile — Extended with brandConfig: { logoStorageId, logoUrl, primaryColor, secondaryColor, accentColor, fontFamily, fontWeights[], emailHeaderHtml, emailFooterHtml, invoiceFooter, invoiceTerms }

brandTemplates — Per-contractor email templates by type (estimate, invoice, follow_up, receipt). Fields: type, subject, bodyHtml, headerStyle, footerStyle, mergeTagDefaults

brandAssets — Generated export files. Fields: contractorId, assetType (business_card | email_sig | social_kit | letterhead | door_hanger | vehicle_wrap | qr_code), storageId, format, generatedAt, version

brandFonts — Available font families. Fields: name, source (google | system | custom), weights[], previewUrl, category (sans-serif | serif | monospace)

Hooks & Convex Functions

api.branding.queries

          .getBrandProfile — Full brand config + completeness score

          .getEmailTemplates — All templates by type

          .getInvoiceSettings — Invoice brand config + preview data

          .getExportableAssets — Generated assets with download URLs

          .getPublicBrandProfile — Public-facing brand (used by poster views)

api.branding.mutations

          .uploadLogo — Upload + auto-crop via sharp

          .updateColors — Save primary/secondary/accent

          .updateTypography — Font family + weights

          .saveEmailTemplate — Upsert template by type

          .saveInvoiceSettings — Footer text + terms

          .generateAsset — Trigger server-side asset generation

          .resetToDefaults — Clear custom brand, revert to platform defaults

api.branding.actions

          .renderAssetPDF — Puppeteer server-side render for print assets

          .generateQRCode — QR with brand logo overlay

          .sendTestEmail — SendGrid test send with brand template

          .exportBrandKit — ZIP all assets for bulk download

Components

BrandScoreRing — Conic-gradient progress ring with completeness %

          ColorSwatchPicker — Swatch + hex input + preset grid

          FontFamilySelector — Font list with live preview samples

          EmailTemplateMock — Branded email header/body/footer preview

          InvoiceTemplateMock — Invoice with live brand application

          BrandedProfileCard — Public profile with custom colors/logo

          BrandedBidCard — Bid card with contractor brand applied

          BrandAssetRow — Downloadable asset with icon/meta/dl button

          LogoPreviewToggle — Light/dark/colored bg preview switcher

          MergeTagChip — Inline merge tag reference chip

Identity & Assets

9:41

Branding

Logo

kowalski-hvac-logo.png • 1200×400

Colors

Typography

Heading Style

Poppins Bold • 24px

Body text style for descriptions and content.

Inter Regular • 16px

Brand Assets

Logo Pack (PNG, SVG)

4 files • 2.1 MB

Color Palette

ASE, JSON

Brand Guide PDF

12 pages • 4.8 MB

Templates & Preview

9:41

Templates & Preview

Templates

Email Templates

4 branded templates

Invoice Template

Custom header & footer

Public Profile

Live preview available

Public Profile Preview

Kowalski HVAC & Plumbing

Professional HVAC and plumbing services serving Summit County. Licensed, insured, and trusted.

Brand Studio

https://app.3bids.io/contractor/branding

Brand Studio

Logo

Colors

Typography

Templates

Logo Upload

Drop logo here or click to upload

Color Palette

Primary

#B85042

Secondary

#002D4D

Text

#2D2D2D

Background

#F3F4F6

Export & Preview

https://app.3bids.io/contractor/branding/preview

Public Profile Preview

Live Preview

Export Assets

Logo Pack

PNG, SVG, ICO

Color Swatches

ASE, JSON, CSS

Brand Guide PDF

12 pages, full spec