@liquidityio/brand

Liquidity's brand package: org config, theme seeds, fonts, palettes, logo assets. Consumed by every Liquidity frontend (exchange, id, superadmin, console, platform, sandbox, swap, pay, docs) for theming, logos, and registered-chain / RPC / IAM URLs.

Install

pnpm add @liquidityio/brand

Usage

Tamagui

import { brandConfig } from '@liquidityio/brand'
import { TamaguiProvider } from 'tamagui'

<TamaguiProvider config={brandConfig}>
  <App />
</TamaguiProvider>

Tailwind / shadcn

One import in your app's main CSS:

@import '@liquidityio/brand/liquidity-tw.css';

Pulls in tailwindcss, Liquidity easing / fonts, generated palettes, and the shadcn semantic color mappings — in the right order.

Brand data

import { config, brandIdentity, brandConfig } from '@liquidityio/brand'
import type { BrandIdentity, OrgConfig } from '@liquidityio/brand'

// Logo assets
// @liquidityio/brand/assets/logo/logo.svg
// @liquidityio/brand/assets/logo/favicon.svg
// @liquidityio/brand/assets/logo/wordmark.svg

Structure

src/
├── org-config.json       identity, domains, chains, RPC, API, IAM, WalletConnect
├── themes.json           7 theme seeds (used to generate palettes)
├── brand-palettes.css    generated by prebuild (gitignored)
├── tw-additions.css      Liquidity non-color TW tokens (easing, fonts)
├── liquidity-tw.css      bundle: tailwind + additions + palettes + semantic
├── fonts.ts              Liquidity font defs (pplxSans)
├── types.ts              BrandIdentity, OrgConfig
└── index.ts              re-exports config, brandIdentity, brandConfig
assets/
└── logo/                 logo, logo-mono, logo-white, wordmark, favicon (SVG)

Local development

pnpm install
pnpm build      # regenerate palettes + build CSS bundles
pnpm test

License

Proprietary — Liquidity.io, Inc.