---
title: "4Fin - Brand Kit"
description: "Official brand assets, colors, typography, and usage guidelines for 4fin."
canonical_url: "https://fourfin.app/brand"
meta:
  "og:description": "Official brand assets, colors, typography, and usage guidelines for 4fin."
  "og:title": "4Fin - Brand Kit"
---

> Index of every page on this site: [llms.txt](https://fourfin.app/llms.txt)

**Brand Kit **

# **4fin Brand Assets **

Official guidelines for logo usage, color palette, and typography. Use these assets consistently to represent the 4fin brand.

## **Logo **

The 4fin logo consists of the icon mark paired with the wordmark. Use them together whenever possible.

**4fin**

Light background

**4fin**

Dark background

**4fin**

Primary fill

Icon mark only

Icon mark — dark

## **Color Palette **

Core colors that define the 4fin visual identity. Click a value to copy it.

### **Brand**

**Primary**

### **Light Mode**

**Background**

**Foreground**

**Muted**

**Muted Foreground**

**Border**

**Destructive**

### **Dark Mode**

**Background**

**Foreground**

**Muted**

**Muted Foreground**

**Border**

**Destructive**

## **Typography **

Two typefaces keep the brand clear and consistent across all surfaces.

**Space Grotesk**

Display / Headlines

500 Medium600 SemiBold700 Bold

4fin — Track what you spend.

**Manrope**

Body / UI

400 Regular500 Medium600 SemiBold

See all your accounts in one place and handle shared expenses without spreadsheets.

## **Type Scale **

Reference scale for headings and body text.

Display**4fin**48px / 3rem

H1**Track what you spend.**36px / 2.25rem

H2**Brand Guidelines**24px / 1.5rem

H3**Color Palette**20px / 1.25rem

BodySee all your accounts in one place.16px / 1rem

SmallSecondary information and captions.14px / 0.875rem

XSmallLabels, tags, and badges.12px / 0.75rem

```json
{"@context":"https://schema.org","@graph":[{"@id":"https://fourfin.app/#website","@type":"WebSite","name":"4Fin","url":"https://fourfin.app/"},{"@id":"https://fourfin.app/brand#webpage","@type":"WebPage","description":"Official brand assets, colors, typography, and usage guidelines for 4fin.","name":"Brand Kit","url":"https://fourfin.app/brand","isPartOf":{"@id":"https://fourfin.app/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://fourfin.app/brand"]}]}]}
```

## Sitemap

See the full [sitemap](https://fourfin.app/sitemap.md) for all pages.