Finitless Brand Guidelines

Feed This Brand to Your LLM

Get brand-consistent output from Claude, GPT, or any AI coding agent. Copy everything at once or pick a specific file.

Copies SKILL.md + CLAUDE.md combined. Paste directly into any LLM prompt.

Or copy individual files:

Recommended

SKILL.md

Add as a custom skill in Claude Code, or paste into any LLM's system prompt. Contains colors, typography, gradients, visual rules, and component patterns.

Works with: Claude Code skills, ChatGPT custom instructions, Cursor rules

For Programmatic Use

brand-manifest.json

Fetch the complete brand identity as structured JSON from any origin. CORS enabled.

Returns: colors, typography, assets, voice, gradients

For Deep Integration

CLAUDE.md

Drop into your project root. Any AI agent (Claude Code, Copilot, Cursor) will automatically pick it up and apply brand rules.

Covers: logo selection, colors, fonts, voice rules, visual patterns

Quick Start

# Option 1: Fetch manifest in your code fetch('https://brand.finitless.com/brand-manifest.json') .then(r => r.json()) .then(brand => console.log(brand.colors.primary)); # Option 2: Add CLAUDE.md to your repo curl -o CLAUDE.md https://brand.finitless.com/CLAUDE.md

Logos & Icons

The Finitless mark combines the letter N with the infinity symbol. The wordmark uses the BEASIGNE typeface.

Logo Lockups

Horizontal

On dark (preferred) · transparent bg PNG

On light · transparent bg PNG

Square

Square on dark · black bg PNG

Square on light · transparent bg PNG

Rectangular

Rect on dark · black bg PNG

Logo Size Variants

Download logos at the exact size you need. All generated from high-resolution sources.

All horizontal and square-on-light variants have transparent backgrounds. Square-on-dark and rect-on-dark have solid black backgrounds (baked in).

Brand Icon

The Finitless mark available at every size you need, in dark, light, and transparent variants.

SVG Master (scales to any size)

finitless-icon-on-dark-512.png

Download

Quick Pick

Which asset to use for common contexts.

Context	Recommended Asset	Size
Website header (dark bg)	`finitless-logo-horizontal-on-dark.png`	300w
Website header (light bg)	`finitless-logo-horizontal-on-light.png`	300w
Favicon	`finitless-icon-on-dark-32.png`	32px
Social media avatar	`finitless-icon-on-dark-1000.png`	1000px
PWA / App icon	`finitless-icon-on-dark-512.png`	512px
Android launcher	`finitless-icon-on-dark-192.png`	192px
Apple App Store	`finitless-icon-on-dark-1024.png`	1024px
OG / Social card image	`finitless-logo-square-on-dark-1024.png`	1024px
Print (high-res)	`finitless-icon-print-2552.png`	2552px
Overlay / custom bg	`finitless-logo-horizontal-on-dark.png`	300w

Usage Rules

✓ Always resize proportionately

✗ Never stretch or distort the logo

✓ Use supplied files only

✗ Never modify or recreate the icon

✓ Maintain 50% icon-height clear space

✗ Never place on clashing backgrounds

✓ Prefer dark variant as default

✗ Never use below 24px (icon) / 80px (logo)

Colors

Click any value to copy it to your clipboard.

Brand Gradient

linear-gradient(to right, #00B7FF, #7A2EFF, #C300FF)

Primary Palette

Finitless Cyan

Finitless Purple

Finitless Magenta

Neutral Palette

Black

Background

White

Semantic Colors

Error / Alert

Success

Warning

Info Tint

CSS Custom Properties

CSS :root { --color-primary: #00B7FF; --color-secondary: #7A2EFF; --color-tertiary: #C300FF; --color-background: #0a0a0a; --color-black: #000000; --color-white: #FFFFFF; --color-card-surface: rgba(255, 255, 255, 0.05); --color-border: rgba(255, 255, 255, 0.10); --color-muted-text: rgba(255, 255, 255, 0.60); --color-error: #ff3b45; --color-success: #22c55e; --color-warning: #f59e0b; --color-info: #eaf4ff; --gradient-brand: linear-gradient(to right, #00B7FF, #7A2EFF, #C300FF); --gradient-cta: linear-gradient(to right, #00B7FF, #7A2EFF); --glow-primary: 0 0 20px rgba(0, 183, 255, 0.3); }

Tailwind Config

tailwind.config.js colors: { brand: { cyan: '#00B7FF', purple: '#7A2EFF', magenta: '#C300FF', }, surface: { DEFAULT: '#0a0a0a', black: '#000000', }, semantic: { error: '#ff3b45', success: '#22c55e', warning: '#f59e0b', info: '#eaf4ff', }, }

Typography

All UI text uses Inter from Google Fonts. The logo uses BEASIGNE (render from image assets only).

Inter

Google Fonts — Variable weight font

400 Regular

600 Semi-Bold

700 Bold

800 Extra-Bold

Font Loading

HTML <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">

Next.js (App Router) import { Inter } from 'next/font/google'; const inter = Inter({ subsets: ['latin'], weight: ['400', '600', '700', '800'], display: 'swap', });

CSS Fallback Stack font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

Type Scale

display Inter Extra-Bold 72px / 800 / 1.1

Never Miss

h1 Inter Extra-Bold 48px / 800 / 1.2

Brand Guidelines

h2 Inter Bold 36px / 700 / 1.25

Section Heading

h3 Inter Bold 24px / 700 / 1.3

Sub-Section Heading

h4 Inter Semi-Bold 20px / 600 / 1.4

Card Title

body-lg Inter Regular 18px / 400 / 1.6

AI-powered voice and WhatsApp agents that capture every order, 24/7.

body Inter Regular 16px / 400 / 1.6

Default body text for paragraphs and descriptions.

body-sm Inter Regular 14px / 400 / 1.5

Secondary text and descriptions.

caption Inter Regular 12px / 400 / 1.5

Labels and fine print

overline Inter Semi-Bold 12px / 600 / uppercase / 0.05em

Category Label

Component Patterns

Do's and Don'ts for building with the Finitless brand system. Each correct example includes copyable code.

Buttons

Cards

Voice Agent

Answers every call. Takes every order.

Voice Agent

Answers every call. Takes every order.

Gradient Text

Never Miss

Spacing

Use a 4px grid. All spacing values are multiples of 4.

Border radius: 8px (sm), 12px (default), 16px (lg), 24px (xl)

Voice & Tone

How we communicate across every touchpoint.

Personality

Confident, not arrogant

We state facts and let results speak.

✓ "Finitless captures orders your staff would miss."

✗ "We are the best AI company in the restaurant industry."

Revolutionary, not combative

We empower restaurants. We don't attack platforms.

✓ "The future of restaurant ordering is already here."

✗ "Traditional ordering systems are dead."

Practical, not visionary

Dollars saved today, not a distant future.

✓ "Recover $31,000 in missed orders this year."

✗ "Imagine a world where every restaurant uses AI."

Direct, not salesy

Straight talk about ROI and results.

✓ "You miss 40% of calls. That is $31,000 walking out the door."

✗ "Do not miss this incredible limited-time opportunity!"

Words We Use vs. Avoid

✓ Words We Use

AI agents AI ordering agents AI-powered recover capture own direct efficient 24/7 never miss

✗ Words We Avoid

chatbot bot artificial intelligence smart virtual assistant disrupt maybe try revolutionize leverage synergy

For Developers

Machine-readable brand identity. Fetch everything in one request.

GET /brand-manifest.json // Returns: colors, typography, assets, voice, gradients — everything. // CORS enabled. Accessible from any origin.

Full documentation: GitHub Repository