Rio Brand: Colors, Fonts, Logo & Visual Identity
Rio Brand Identity
A complete profile of Rio's visual system — colors, typography, components, and personality — extracted from https://www.rio.trade. Built for designers, agents, and AI tools.
Color Palette
Brand palette extracted from https://www.rio.trade.
- primary
Hex: #36394A
RGB: rgb(54, 57, 74) - secondary
Hex: #091135
RGB: rgb(9, 17, 53) - accent
Hex: #0F77FF
RGB: rgb(15, 119, 255) - background
Hex: #FFFFFF
RGB: rgb(255, 255, 255) - textPrimary
Hex: #000000
RGB: rgb(0, 0, 0) - link
Hex: #0F77FF
RGB: rgb(15, 119, 255)
Typography
Each font links to its Google Fonts page where available.
- primary
Satoshi Variable
Google Fonts → - heading
Playfair Display
Google Fonts →
Visual Assets
UI Components
Live previews rendered using Rio's actual button styles.
Button Primary
- Background: #0F77FF
- Text Color: #FFFFFF
- Border Color: #FFFFFF
- Border Radius: 10px
- Shadow: rgba(12, 43, 100, 0.32) 0px 1px 2px 0px, rgb(15, 119, 255) 0px 0px 0px 1px
Button Secondary
- Background: #FFFFFF
- Text Color: #000000
- Border Radius: 0px
- Shadow: none
Brand Personality
- Tone: professional
- Energy: medium
- Audience: LATAM financial market
Frequently Asked Questions
What is Rio's primary brand color?
Rio's primary brand color is #36394A. It anchors the visual identity across their website, product UI, and marketing materials.What accent color does Rio use?
Rio uses #0F77FF as an accent color, typically applied to interactive elements like links, buttons, and call-to-action emphasis.What font does Rio use?
Rio uses Satoshi Variable for body text and Playfair Display for headings. Fonts were detected on https://www.rio.trade as part of their live design system.Does Rio use a light or dark theme?
Rio's primary site uses a light color scheme, with a background of #FFFFFF.Where can I find Rio's logo?
Rio's logo is available directly on their site (https://www.rio.trade). The current logo URL is included in the machine-readable JSON profile linked above.How was this brand profile generated?
This profile was extracted from https://www.rio.trade 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 Rio.
Machine-Readable Profile
Direct endpoints for agents, designers, and tooling. No login or auth required.
{
"colorScheme": "light",
"fonts": [
{
"family": "Satoshi Variable",
"role": "body"
},
{
"family": "Playfair Display",
"role": "heading"
}
],
"colors": {
"primary": "#36394A",
"secondary": "#091135",
"accent": "#0F77FF",
"background": "#FFFFFF",
"textPrimary": "#000000",
"link": "#0F77FF"
},
"typography": {
"fontFamilies": {
"primary": "Satoshi Variable",
"heading": "Playfair Display"
},
"fontStacks": {
"heading": [
"Satoshi Variable",
"sans-serif"
],
"body": [
"Satoshi Variable",
"sans-serif"
],
"paragraph": [
"Satoshi Variable",
"sans-serif"
]
},
"fontSizes": {
"h1": "120px",
"h2": "32px",
"body": "20px"
}
},
"spacing": {
"baseUnit": 4,
"borderRadius": "10px"
},
"components": {
"buttonPrimary": {
"background": "#0F77FF",
"textColor": "#FFFFFF",
"borderColor": "#FFFFFF",
"borderRadius": "10px",
"borderRadiusCorners": {
"topLeft": "10px",
"topRight": "10px",
"bottomRight": "10px",
"bottomLeft": "10px"
},
"shadow": "rgba(12, 43, 100, 0.32) 0px 1px 2px 0px, rgb(15, 119, 255) 0px 0px 0px 1px"
},
"buttonSecondary": {
"background": "#FFFFFF",
"textColor": "#000000",
"borderRadius": "0px",
"borderRadiusCorners": {
"topLeft": "0px",
"topRight": "0px",
"bottomRight": "0px",
"bottomLeft": "0px"
},
"shadow": "none"
}
},
"images": {
"logo": "https://cdn.prod.website-files.com/66c6da1b964424ba9f01b59d/66c6da1b964424ba9f01b5ea_rio%20-%20logo%2001.svg",
"favicon": "https://cdn.prod.website-files.com/6682603c2141809da57a99af/66840c89a7db2e217a0b3e02_Favicon.png",
"ogImage": null
},
"personality": {
"tone": "professional",
"energy": "medium",
"targetAudience": "LATAM financial market"
}
}