Laylo Brand: Colors, Fonts, Logo & Visual Identity

Laylo Brand Identity

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

Primary

Primary Color:
#0C4D5C

Accent Color:
#22A1BC

Body Font:
Inter

Heading Font:
Bricolage Grotesque

Color Palette

Brand palette extracted from https://laylo.com.

Typography

Each font links to its Google Fonts page where available.

Visual Assets

Logo

Favicon

Social Card

UI Components

Live previews rendered using Laylo's actual button styles.

Input

Button Primary

Button Secondary

Brand Personality

Frequently Asked Questions

What is Laylo's primary brand color?
Laylo's primary brand color is #0C4D5C. It anchors the visual identity across their website, product UI, and marketing materials.

What accent color does Laylo use?
Laylo uses #22A1BC as an accent color, typically applied to interactive elements like links, buttons, and call-to-action emphasis.

What font does Laylo use?
Laylo uses Inter for body text and Bricolage Grotesque for headings.

Does Laylo use a light or dark theme?
Laylo's primary site uses a dark color scheme, with a background of #000000.

Where can I find Laylo's logo?
Laylo's logo is available directly on their site (https://laylo.com). The current logo URL is included in the machine-readable JSON profile linked above.

Methodology

Brand data on this page was extracted from https://laylo.com 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.

Machine-Readable Profile

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

{
  "colorScheme": "dark",
  "fonts": [
    {
      "family": "Inter",
      "role": "body"
    },
    {
      "family": "Bricolage Grotesque",
      "role": "heading"
    }
  ],
  "colors": {
    "primary": "#0C4D5C",
    "secondary": "#05252B",
    "accent": "#22A1BC",
    "background": "#000000",
    "textPrimary": "#000000",
    "link": "#22A1BC"
  },
  "typography": {
    "fontFamilies": {
      "primary": "Inter",
      "heading": "Bricolage Grotesque"
    },
    "fontStacks": {
      "heading": [
        "Bricolage Grotesque",
        "sans-serif"
      ],
      "body": [
        "Arial",
        "sans-serif"
      ],
      "paragraph": [
        "Inter",
        "sans-serif"
      ]
    },
    "fontSizes": {
      "h1": "51.2px",
      "h2": "20px",
      "body": "20px"
    }
  },
  "spacing": {
    "baseUnit": 4,
    "borderRadius": "24px"
  },
  "components": {
    "input": {
      "background": "transparent",
      "textColor": "#EDF0F5",
      "borderColor": null,
      "borderRadius": "0px",
      "shadow": "none"
    },
    "buttonPrimary": {
      "background": "#22A1BC",
      "textColor": "#FFFFFF",
      "borderRadius": "24px",
      "shadow": "none"
    },
    "buttonSecondary": {
      "background": "#05252B",
      "textColor": "#53B2C6",
      "borderColor": "#0B4957",
      "borderRadius": "16px",
      "shadow": "none"
    }
  },
  "images": {
    "logo": "https://laylo.com/wf-cdn/61d60e9ad7eb927cabbb4c9e/62d09c5eb42661c340329d42_layloLogo.svg",
    "favicon": "https://laylo.com/wf-cdn/61d60e9ad7eb927cabbb4c9e/634dbd76ce407d3c53b48459_favicon-32x32.png",
    "ogImage": "https://laylo-public.s3.us-west-2.amazonaws.com/assets/openGraph-general%401x.jpg"
  },
  "personality": {
    "tone": "modern",
    "energy": "medium",
    "targetAudience": "artists, live event organizers, and creators"
  }
}