llms.txt

Okta Brand Identity

A complete profile of Okta's visual system — colors, typography, components, and personality.

Quick Facts

Field Value
Primary #3F59E4
Accent #0131FF
Body Font Aeonik
Heading Font Helvetica Neue

Color Palette

Typography

Visual Assets

UI Components

Brand Personality

Tone: professional · Energy: medium · Audience: businesses and enterprises

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.

Machine-Readable Profile

{
 "colorScheme": "light",
 "fonts": [
  {
   "family": "Aeonik",
   "role": "body"
  },
  {
   "family": "Helvetica Neue",
   "role": "heading"
  },
  {
   "family": "Arial",
   "role": "unknown"
  },
  {
   "family": "Playfair Display",
   "role": "display"
  }
 ],
 "colors": {
  "primary": "#3F59E4",
  "secondary": "#1A31A9",
  "accent": "#0131FF",
  "background": "#FFFEFA",
  "textPrimary": "#191919",
  "link": "#B6CAFF"
 },
 "typography": {
  "fontFamilies": {
   "primary": "Aeonik",
   "heading": "Helvetica Neue"
  },
  "fontStacks": {
   "heading": [
    "playfair-display",
    "serif"
   ],
   "body": [
    "Aeonik",
    "sans-serif"
   ],
   "paragraph": [
    "Aeonik",
    "Helvetica Neue",
    "sans-serif"
   ]
  },
  "fontSizes": {
   "h1": "92px",
   "h2": "48px",
   "body": "16px"
  }
 },
 "spacing": {
  "baseUnit": 4,
  "borderRadius": "8px"
 },
 "components": {
  "buttonPrimary": {
   "background": "#0131FF",
   "textColor": "#FFFEFA",
   "borderRadius": "30px",
   "borderRadiusCorners": {
    "topLeft": "30px",
    "topRight": "30px",
    "bottomRight": "30px",
    "bottomLeft": "30px"
   },
   "shadow": "none"
  },
  "buttonSecondary": {
   "background": "#575655",
   "textColor": "#FFFFFF",
   "borderRadius": "30px",
   "borderRadiusCorners": {
    "topLeft": "30px",
    "topRight": "30px",
    "bottomRight": "30px",
    "bottomLeft": "30px"
   },
   "shadow": "none"
  }
 },
 "images": {
  "logo": "data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22128%22%20height%3D%2242%22%20viewBox%3D%220%200%20128%2042%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M115.466%2027.5989C111.912%2027.5989%20109.401%2024.829%20109.401%2021.1935C109.401%2017.558%20111.914%2014.788%20115.466%2014.788C119.018%2014.788%20121.46%2017.558%20121.46%2021.1935C121.46%2024.829%20118.984%2027.5989%20115.466%2027.5989ZM114.891%2031.4129C117.763%2031.4129%20120.203%2030.2982%20121.745%2027.9593C122.032%2030.2258%20123.683%2031.0543%20125.764%2031.0543H127.415V27.4559H126.698C125.514%2027.4559%20125.226%2026.88%20125.226%2025.548V11.3345H121.423V14.2492C120.131%2012.1983%20117.691%2010.9741%20114.891%2010.9741C109.903%2010.9741%20105.308%2015.1484%20105.308%2021.1935C105.308%2027.2386%20109.902%2031.4129%20114.891%2031.4129ZM95.2975%2026.4825C95.2975%2029.7206%2097.3078%2031.0525%2099.711%2031.0525H104.341V27.4541H100.967C99.5683%2027.4541%2099.2811%2026.9135%2099.2811%2025.5462V14.9311H104.341V11.3327H99.2811V4.7135H95.2975V26.4825ZM77.1749%2031.0525H81.1585V22.5961H82.4869L89.2701%2031.0525H94.295L85.646%2020.3297L92.2847%2011.3345H87.799L82.3795%2018.927H81.1585V4.7135H77.1749V31.0525ZM64.2551%2010.9741C58.6928%2010.9741%2054.0996%2015.1484%2054.0996%2021.1935C54.0996%2027.2386%2058.6928%2031.4129%2064.2551%2031.4129C69.8173%2031.4129%2074.4105%2027.2386%2074.4105%2021.1935C74.4105%2015.1484%2069.8173%2010.9741%2064.2551%2010.9741ZM64.2551%2027.5972C60.7014%2027.5972%2058.1907%2024.8273%2058.1907%2021.1917C58.1907%2017.5562%2060.7031%2014.7863%2064.2551%2014.7863C67.807%2014.7863%2070.3194%2017.5562%2070.3194%2021.1917C70.3194%2024.8273%2067.807%2027.5972%2064.2551%2027.5972Z%22%20fill%3D%22currentColor%22%3E%3C/path%3E%3C/svg%3E",
  "favicon": null,
  "ogImage": "https://www.okta.com/content/dam/okta---digital/en_us/images/graphics/okta-homepage-thumbnail.jpg",
  "logoHref": "https://www.okta.com/"
 },
 "__llm_logo_reasoning": {
 "selectedIndex": 2,
 "reasoning": "Selected #2 because it is visible, medium-sized, located in the header, and links to the homepage, matching the brand 'Okta'.",
 "confidence": 0.95,
 "source": "llm"
 },
 "__llm_button_reasoning": {
 "primary": {
 "index": 0,
 "text": "Contact us",
 "reasoning": "Button #0 has a vibrant blue background (#0131FF), which is a strong brand color, and the text 'Contact us' is action-oriented, making it a clear primary CTA."
 },
 "secondary": {
 "index": 1,
 "text": "Free trial",
 "reasoning": "Button #1 has a neutral background (#575655) and the text 'Free trial', which complements the primary CTA without competing for attention."
 },
 "confidence": 0.95
 },
 "personality": {
 "tone": "professional",
 "energy": "medium",
 "targetAudience": "businesses and enterprises"
 },
 "designSystem": {
 "framework": "custom",
 "componentLibrary": ""
 },
 "confidence": {
 "buttons": 0.95,
 "colors": 0.9,
 "overall": 0.925
 },
 "__llm_metadata": {
 "logoSelection": {
 "llmCalled": true,
 "llmSucceeded": true,
 "finalSource": "llm",
 "rawLogoSelection": {
 "selectedLogoIndex": 2,
 "selectedLogoReasoning": "Selected #2 because it is visible, medium-sized, located in the header, and links to the homepage, matching the brand 'Okta'.",
 "confidence": 0.95
 }
 },
 "buttonClassification": {
 "llmCalled": true,
 "llmSucceeded": true
 }
 }
}