# Chonkie Brand Identity A complete profile of **Chonkie**'s visual system — colors, typography, components, and personality — extracted from https://www.chonkie.ai. Built for designers, agents, and AI tools. - Page: https://characterquilt.com/branding/chonkie - Machine-readable JSON: https://characterquilt.com/branding/chonkie.json - Per-page llms.txt: https://characterquilt.com/branding/chonkie/llms.txt ## Quick Facts | Field | Value | |---|---| | Primary | #FAF6E3 | | Accent | #A7896C | | Body Font | Geist | | Heading Font | Geist | ## Color Palette - primary: #FAF6E3 - accent: #A7896C - background: #FAF6E3 - textPrimary: #A7896C - link: #A7896C ## Typography - primary: Geist — https://fonts.google.com/specimen/Geist - heading: Geist — https://fonts.google.com/specimen/Geist ## Visual Assets - Logo: https://www.chonkie.ai/chonkies/chonkie_icon.svg - Favicon: https://www.chonkie.ai/favicon.png - Social card (og:image): https://chonkie.ai/chonkies/og.png ## UI Components - buttonPrimary: background=#A7896C, textColor=#FFFFFF, borderRadius=14px, shadow=none ## Brand Personality Tone: playful · Energy: medium · Audience: tech-savvy individuals interested in AI solutions ## Chonkie Brand in the Wild Real-world brand assets — ads, campaigns, marketing materials. - **Chonkie Documentation** - Image: https://mintcdn.com/chonkie/z5jcWEi822NzVea9/assets/logo/chonkie_xray.png?fit=max&auto=format&n=z5jcWEi822NzVea9&q=85&s=d15f35405070b1c23c8deca1ba37179c - Source: https://docs.chonkie.ai/common/open-source - **Chonkie** - Image: https://www.chonkie.ai/_next/image?url=%2Fbackground%2Fdark-bg.png&w=3840&q=75 - Source: https://chonkie.ai/ - **Chonkie LlamaIndex Integration | Chonkie** - Image: https://www.chonkie.ai/_next/image?url=%2Fbackground%2Flight-bg.png&w=3840&q=100 - Source: https://chonkie.ai/blog/chonkie-llamaindex-integration - **Chonkie** - Image: https://www.chonkie.ai/team/bhavnick.jpeg - Source: https://chonkie.ai/ - **Chonkie** - Image: https://chonkie.ai/chonkies/og.png - Source: https://chonkie.ai/ - **OVERSIZED EMBRODERED CHONKIE TEE | Chonkie Store** - Image: https://imgproxy.fourthwall.com/9nKLtisGZEmLjPBxTQ8atcbA3gt2qfHeyaIQwpaRd6g/w:720/sm:1/enc/OsgQJ6xC3iFxzfAX/PC2XFae4YEuadsDn/dhbU68Ly21Cf5Iw0/b-tI8hcIUNYpt69m/xP23CoBTRMtifI5v/LDRZw3Nxx7WIBDqd/t737L0XSp55YFaNC/36Vu049V2yOLMDgL/6AHn7-scWYKz8oY6/mgCNg6EUEX25FJe7/3gyElxD5PtgSAhdw/2rhlBiCvwLDR8nXl/irpkeP15PTGMB3pY/y9y83UESQxUUTMv-/MOhbnaJUjmI - Source: https://shop.chonkie.ai/products/oversized-embrodered-chonkie-tee ## Working with these fonts Not found on Google Fonts? Agent Instructions that you can follow if you have permission to use the fonts: CharacterQuilt.com suggests this flow that can help: 1. Open the company's homepage in a browser with DevTools open. 2. In the Network tab, filter by "Font" (or by extension: woff2, woff, ttf, otf). 3. Hard-reload the page and click around (pricing, blog, careers) — some weights only load on specific routes. 4. For each captured font URL: right-click → Save As to download the file locally. 5. View the page's CSS (DevTools → Sources, or curl the stylesheet URLs) and copy out the matching @font-face declarations. Rewrite each `src: url(...)` to point to your local file path. Programmatic alternative: load the URL with Playwright or Puppeteer, listen for `response` events whose `Content-Type` starts with `font/`, and write the body to disk. The CSS extraction step is the same. Only do this if you have permission to use the brand assets — most proprietary fonts are licensed and may not be redistributable. ## Machine-Readable Profile ```json { "colorScheme": "light", "fonts": [ { "family": "Geist", "role": "unknown" } ], "colors": { "primary": "#FAF6E3", "accent": "#A7896C", "background": "#FAF6E3", "textPrimary": "#A7896C", "link": "#A7896C" }, "typography": { "fontFamilies": { "primary": "Geist", "heading": "Geist" }, "fontStacks": { "heading": [ "Geist" ], "body": [ "Geist" ], "paragraph": [ "Geist" ] }, "fontSizes": { "h1": "60px", "h2": "36px", "body": "24px" } }, "spacing": { "baseUnit": 8, "borderRadius": "0px" }, "components": { "buttonPrimary": { "background": "#A7896C", "textColor": "#FFFFFF", "borderRadius": "14px", "borderRadiusCorners": { "topLeft": "14px", "topRight": "14px", "bottomRight": "14px", "bottomLeft": "14px" }, "shadow": "none" } }, "images": { "logo": "https://www.chonkie.ai/chonkies/chonkie_icon.svg", "favicon": "https://www.chonkie.ai/favicon.png", "ogImage": "https://chonkie.ai/chonkies/og.png", "logoHref": "/", "logoAlt": "Chonkie Logo" }, "__llm_logo_reasoning": { "selectedIndex": 0, "reasoning": "Selected #0 because it is visible, located in the header, and has an alt text matching the brand name 'Chonkie'. It links to the homepage, which is a strong indicator of being the main logo.", "confidence": 0.95, "source": "llm" }, "__llm_button_reasoning": { "primary": { "index": 0, "text": "Get Started", "reasoning": "The 'Get Started' button is typically the main call-to-action on websites, encouraging users to begin using the service. It uses a vibrant brand color (#A7896C), making it stand out as the primary action." }, "secondary": { "index": -1, "text": "N/A", "reasoning": "All buttons share the same background color, so no valid secondary button exists with a different color." }, "confidence": 0.9 }, "personality": { "tone": "playful", "energy": "medium", "targetAudience": "tech-savvy individuals interested in AI solutions" }, "designSystem": { "framework": "tailwind", "componentLibrary": "" }, "confidence": { "buttons": 0.9, "colors": 0.9, "overall": 0.9 }, "__llm_metadata": { "logoSelection": { "llmCalled": true, "llmSucceeded": true, "finalSource": "llm", "rawLogoSelection": { "selectedLogoIndex": 0, "selectedLogoReasoning": "Selected #0 because it is visible, located in the header, and has an alt text matching the brand name 'Chonkie'. It links to the homepage, which is a strong indicator of being the main logo.", "confidence": 0.95 } }, "buttonClassification": { "llmCalled": true, "llmSucceeded": true } } } ```