BibleSlides

Brand

Media kit & theme guide

Official BibleSlides colors, logos, fonts, and chrome tokens. Use these for press, partner communications, and any UI that should match the product.

Rule

Stick to the theme colors

App chrome (projects, editor shell, marketing, native tablet apps) must use the logo palette from src/lib/design-tokens.ts. Do not introduce new accent blues, Material blues, or legacy teal #285570. Accent is logo tan. Dark surfaces are slate. Light pages use cream, not gray-50.

Logo palette

Core colors

Slate

#2b323a

Tan

#d29b6c

Gray

#8b929a

Rust

#a45a2b

White

#ffffff

Cream bg

#f5f3f0

Surface

#ffffff

Border

#ddd8d2

Tan hover

#b88455

App chrome

Light & dark themes

APP_LIGHT_THEME

Background

#f5f3f0

Surface

#ffffff

Accent

#8b929a

Text

#2b323a

APP_DARK_THEME

Background

#2b323a

Surface

#343c45

Accent

#8b929a

Text

#e8eaed

Token aliases still named “teal” in code resolve to logo tan (#d29b6c). Prefer importing COLOR_LOGO_TAN, COLOR_LOGO_SLATE, and APP_LIGHT_THEME / APP_DARK_THEME directly.

Typography

Fonts

UI / marketing

Geist Sans

Aa Bb Cc — Present Scripture with clarity

Eyebrows / labels

Geist Mono

BRAND · THEME · MEDIA KIT

Slide headings (warm-neutral default)

Raleway

Teaching the Word

Slide body (warm-neutral default)

Libre Baskerville

In the beginning was the Word, and the Word was with God.

Print

Booklets & leave-behinds

BibleSlides 9×6 landscape booklet preview

8-page booklet · 9″ × 6″ landscape

Saddle-stitch landscape layout with side-by-side pages and a center-spread photo. Print to PDF at 9.25″ × 6.25″.

Open booklet →

BibleSlides 6×9 booklet preview

8-page booklet · 6″ × 9″ portrait

Saddle-stitch print layout. Upload the 6″ × 9″ PDF, or open the HTML for a live preview.

Download PDF →Open booklet →

Assets

Logos & downloads

Mark (icon), wordmark (BIBLESLIDES.APP), and lockup (both together). Digital sizes plus print-ready PNGs up to 8192px (~27″ at 300dpi). Prefer SVG when your printer accepts it; otherwise use the highlighted print sizes.

Download all logos (ZIP)

Mark

The quadrant-cross icon, without type.

Mark · square

Mark · square

Full-bleed sharp square — preferred. No rounded-corner border.

SVG64px128px256px512px1024px2048px
Mark · rounded

Mark · rounded

Soft rounded corners. Transparent outside the radius (use on matching backgrounds).

SVG64px128px256px512px1024px2048px

Wordmark

BIBLESLIDES.APP type only — outlined Geist Light, no icon.

Wordmark · dark

Wordmark · dark

BIBLESLIDES.APP in Geist Light (outlined SVG). Solid white type for slate or dark backgrounds.

SVG64px128px256px512px1024px
Wordmark · light

Wordmark · light

BIBLESLIDES.APP in Geist Light (outlined SVG). Solid dark type for cream or white.

SVG64px128px256px512px1024px
Wordmark · on slate

Wordmark · on slate

Ready-to-drop wordmark on brand slate.

64px128px256px512px1024px
Wordmark · on cream

Wordmark · on cream

Ready-to-drop wordmark on cream.

64px128px256px512px1024px

Lockup

Mark and wordmark together.

Lockup · dark

Lockup · dark

Mark + wordmark with light type. Use on slate or dark backgrounds.

SVG64px128px256px512px1024px
Lockup · light

Lockup · light

Mark + wordmark with dark type. Use on cream or white.

SVG64px128px256px512px1024px
Lockup · on slate

Lockup · on slate

Ready-to-drop header lockup on brand slate.

64px128px256px512px1024px
Lockup · on cream

Lockup · on cream

Ready-to-drop header lockup on cream.

64px128px256px512px1024px
QR code

QR code

Links to bibleslides.app

Download

Logo pack folder

Browse /mediakit/logos/ online, or the in-repo copy under media kit/logos/.

Open guide →

Keep clear space around the mark; do not recolor the quadrant cross except placing it on solid slate or cream. Regenerate the pack with npm run generate:mediakit-logos.

Reference

Source of truth

  • src/lib/design-tokens.ts — colors, radii, button styles
  • docs/UI_THEME.md — full UI styling guide
  • Logo swatches: slate #2b323a, tan #d29b6c, gray #8b929a, rust #a45a2b, soft gray #c7c7c7