x1 Brand: Colors, Fonts, Logo & Visual Identity

x1 Brand Identity

A complete profile of x1's visual system — colors, typography, components, and personality — extracted from https://www.x1.new. Built for designers, agents, and AI tools.

Primary

#0000EE

Accent

#3F90B2

Body Font

Inter

Heading

Inter

Color Palette

Brand palette extracted from https://www.x1.new.

primary

#0000EE

rgb(0, 0, 238)

secondary

#0885FE

rgb(8, 133, 254)

accent

#3F90B2

rgb(63, 144, 178)

background

#000000

rgb(0, 0, 0)

textPrimary

#000000

rgb(0, 0, 0)

link

#3F90B2

rgb(63, 144, 178)

Typography

Each font links to its Google Fonts page where available.

primary

Inter

Inter Google Fonts →

heading

Inter

Inter Google Fonts →

Visual Assets

Favicon

Social Card

UI Components

Live previews rendered using x1's actual button styles.

Input

input

background transparent textColor #FFFFFF borderColor null borderRadius 0px shadow none

Button Primary

buttonPrimary

background #FFFFFF textColor #0000EE borderRadius 27px shadow none

Button Secondary

buttonSecondary

background #262626 textColor #0000EE borderRadius 22px shadow none

Brand Personality

Tone: modern Energy: high Audience: developers and tech enthusiasts

x1 Brand in the Wild

Image: framerusercontent.com

Source: x1.new

Image: framerusercontent.com

Source: x1.new

Image: framerusercontent.com

Source: x1.new

Image: framerusercontent.com

Source: x1.new

Image: framerusercontent.com

Source: x1.new

Image: framerusercontent.com

Source: x1.new

Frequently Asked Questions

What is x1's primary brand color?

x1's primary brand color is #0000EE. It anchors the visual identity across their website, product UI, and marketing materials.

What accent color does x1 use?

x1 uses #3F90B2 as an accent color, typically applied to interactive elements like links, buttons, and call-to-action emphasis.

What font does x1 use?

x1 uses Inter as the primary typeface across body and headings.

Does x1 use a light or dark theme?

x1's primary site uses a dark color scheme, with a background of #000000.

How was this brand profile generated?

This profile was extracted from https://www.x1.new using the Firecrawl branding extraction API, which inspects the live page's CSS, fonts, color tokens, and component styles. It is not affiliated with or endorsed by x1.

Methodology

Brand data on this page was extracted from https://www.x1.new on 2026-07-27 using the Firecrawl branding extraction API, which inspects each site's live CSS, font network requests, color tokens, and component styles. Brand-in-the-wild images were sourced via Google Image Search restricted to ad/webinar/report queries and link out to their original third-party publishers; we link to the source rather than re-hosting third-party content. This page is published by CharacterQuilt and is not affiliated with or endorsed by x1.

Machine-Readable Profile

Direct endpoints for agents, designers, and tooling. No login or auth required.

GET /branding/x1.json GET /branding/x1/llms.txt

{ "colorScheme": "dark", "fonts": [ { "family": "Inter", "role": "body" }, { "family": "SF Pro", "role": "unknown" } ], "colors": { "primary": "#0000EE", "secondary": "#0885FE", "accent": "#3F90B2", "background": "#000000", "textPrimary": "#000000", "link": "#3F90B2" }, "typography": { "fontFamilies": { "primary": "Inter", "heading": "Inter" }, "fontStacks": { "heading": [ "sans-serif" ], "body": [ "sans-serif" ], "paragraph": [ "SF Pro", "sans-serif" ] }, "fontSizes": { "h1": "12px", "h2": "52px", "body": "11px" } }, "spacing": { "baseUnit": 4, "borderRadius": "15px" }, "components": { "input": { "background": "transparent", "textColor": "#FFFFFF", "borderColor": null, "borderRadius": "0px", "borderRadiusCorners": { "topLeft": "0px", "topRight": "0px", "bottomRight": "0px", "bottomLeft": "0px" }, "shadow": "none" }, "buttonPrimary": { "background": "#FFFFFF", "textColor": "#0000EE", "borderRadius": "27px", "borderRadiusCorners": { "topLeft": "27px", "topRight": "27px", "bottomRight": "27px", "bottomLeft": "27px" }, "shadow": "none" }, "buttonSecondary": { "background": "#262626", "textColor": "#0000EE", "borderRadius": "22px", "borderRadiusCorners": { "topLeft": "22px", "topRight": "22px", "bottomRight": "22px", "bottomLeft": "22px" }, "shadow": "none" } }, "images": { "logo": null, "favicon": "https://framerusercontent.com/images/8ssgaGUfUPgfNEA2p4B4z9irLok.png", "ogImage": "https://framerusercontent.com/images/1G55tlHIECcgAlyqX5vZMBKFVY.png" }, "__llm_button_reasoning": { "primary": { "index": 1, "text": "Start Building", "reasoning": "The button 'Start Building' has a light background (#FFFFFF) which contrasts with the dark theme of the site, making it stand out. The text is action-oriented, encouraging users to begin using the service, which aligns with a primary CTA." }, "secondary": { "index": 0, "text": "Join Discord", "reasoning": "The button 'Join Discord' has a dark background (#262626) and serves as a secondary action, inviting users to engage with the community rather than directly using the service." }, "confidence": 0.95 }, "personality": { "tone": "modern", "energy": "high", "targetAudience": "developers and tech enthusiasts" }, "designSystem": { "framework": "custom", "componentLibrary": "" }, "confidence": { "buttons": 0.95, "colors": 0.9, "overall": 0.925 }, "__llm_metadata": { "logoSelection": { "llmCalled": false, "llmSucceeded": false, "finalSource": "none" }, "buttonClassification": { "llmCalled": true, "llmSucceeded": true } } }