Public Beta

|Submit your startup
SaaSFolkbeta

Brand Kit

SaaSFolk Identity

Everything you need to represent SaaSFolk. Download logos, grab color tokens, and follow our usage guidelines for press, partnerships, and integrations.

SaaSFolk icon on dark
SaaSFolk icon on light
SaaSFolk icon gradient

The Mark

Fusion A — Glass Grid Container

3×3 Glass Grid

Nine gradient tiles in a 3-by-3 matrix represent the diversity of SaaS tools in our directory. Each tile uses a different teal opacity for depth.

3D Layered Container

Three stacked rounded rectangles create a subtle 3D effect. The front face has a specular shine gradient, mimicking glass material.

Monospace Wordmark

"SaaS" in foreground color, "Folk" in brand teal. Set in JetBrains Mono Bold to match the site's developer-friendly aesthetic.

Lockups

Logo Usage

SaaSFolk wordmark on dark

On dark backgrounds

White text + teal accent. Use #fafafa for “SaaS” and #2dd4bf for “Folk”.

SaaSFolk wordmark on light

On light backgrounds

Dark text + deep teal accent. Use #18181b for “SaaS” and #0d9488 for “Folk”.

Clear Space

Maintain a minimum clear space of 0.25× the icon width on all sides. This ensures the mark remains legible and uncluttered.

Download Kit

10 Assets — SVG

Icon — Primary

Icon — Primary

Transparent SVG · glass grid mark

SVG
Icon — On Dark

Icon — On Dark

Dark rounded tile · social avatars

SVG
Icon — On Light

Icon — On Light

Light rounded tile · light backgrounds

SVG
Icon — Gradient BG

Icon — Gradient BG

Premium gradient tile · featured spots

SVG
Icon — Square Dark

Icon — Square Dark

Square dark · GitHub, LinkedIn profile

SVG
Icon — Mono (Dark Surfaces)

Icon — Mono (Dark Surfaces)

White one-color · dark UI placement

SVG
Icon — Mono (Light Surfaces)

Icon — Mono (Light Surfaces)

Black one-color · light UI placement

SVG
Wordmark — Dark BG

Wordmark — Dark BG

Full lockup · dark surfaces

SVG
Wordmark — Light BG

Wordmark — Light BG

Full lockup · light surfaces

SVG
LinkedIn Banner

LinkedIn Banner

1584×396 · company page cover

SVG

Embeddable Badges

“Listed on SaaSFolk” Badges

Add a badge to your website or GitHub README to show your product is listed. Replace YOUR-SLUG with your product's URL slug.

Listed on SaaSFolk — Dark

Listed on SaaSFolk — Dark

Pill badge for dark websites

<a href="https://saasfolk.com/products/YOUR-SLUG" target="_blank" rel="noopener"><img src="https://saasfolk.com/brand/badges/listed-on-saasfolk-dark.svg" alt="Listed on SaaSFolk" width="220" height="54" /></a>
Listed on SaaSFolk — Light

Listed on SaaSFolk — Light

Pill badge for light websites

<a href="https://saasfolk.com/products/YOUR-SLUG" target="_blank" rel="noopener"><img src="https://saasfolk.com/brand/badges/listed-on-saasfolk-light.svg" alt="Listed on SaaSFolk" width="220" height="54" /></a>
Featured on SaaSFolk — Dark

Featured on SaaSFolk — Dark

Premium badge with star accent

<a href="https://saasfolk.com/products/YOUR-SLUG" target="_blank" rel="noopener"><img src="https://saasfolk.com/brand/badges/featured-on-saasfolk-dark.svg" alt="Featured on SaaSFolk" width="250" height="54" /></a>
Featured on SaaSFolk — Light

Featured on SaaSFolk — Light

Premium badge for light sites

<a href="https://saasfolk.com/products/YOUR-SLUG" target="_blank" rel="noopener"><img src="https://saasfolk.com/brand/badges/featured-on-saasfolk-light.svg" alt="Featured on SaaSFolk" width="250" height="54" /></a>
GitHub Badge — Listed

GitHub Badge — Listed

Flat badge for README.md

[![Listed on SaaSFolk](https://saasfolk.com/brand/badges/saasfolk-github-badge.svg)](https://saasfolk.com/products/YOUR-SLUG)
GitHub Badge — Featured

GitHub Badge — Featured

Flat badge with star for README.md

[![Featured on SaaSFolk](https://saasfolk.com/brand/badges/saasfolk-github-featured.svg)](https://saasfolk.com/products/YOUR-SLUG)

Core Palette

Colors

Teal 400

Primary accent

Teal 500

Links & buttons

Teal 600

Light-mode accent

Teal 900

Container base

Ink 950

Dark background

Surface 50

Light background

Container Gradient

Used for the 3D icon container background

Typography

JetBrains Mono

Wordmark & code-style text

Greycliff CF

Headings & display

Space Grotesk

Body text

Usage Rules

Do & Don't

Do
  • Use the official SVG files from this page
  • Maintain clear space of 0.25× icon width around the mark
  • Use the teal-accented version as the primary logo
  • Pair with JetBrains Mono for body text consistency
Don't
  • Stretch, rotate, or skew the logo
  • Change the grid tile colors or layout
  • Add effects like shadows, outlines, or bevels
  • Place on busy backgrounds without a container

Links

Find Us

Need a custom export?

PNG at specific dimensions, animated logo, or co-branded lockup? Reach out and we'll prepare it for you.

press@saasfolk.com