ReadMe Brand Identity

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

Color Palette

Brand palette extracted from http://readme.com.

• primary: #384248 (rgb(56, 66, 72))
• secondary: #637288 (rgb(99, 114, 136))
• accent: #E95F6A (rgb(233, 95, 106))
• background: #FFFFFF (rgb(255, 255, 255))
• textPrimary: #118CFD (rgb(17, 140, 253))
• link: #118CFD (rgb(17, 140, 253))

Typography

Each font links to its Google Fonts page where available.

• primary: Segoe UI (Segoe UI Google Fonts →)
• heading: Segoe UI (Segoe UI Google Fonts →)
  Marfa, helvetica, arial, sans-serif

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.   

Visual Assets

%20!important%3B%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M1182.081%2C55.771c-11.042-11.046-26.75-17.183-44.912-17.183-38.042%2C0-65.043%2C26.754-65.043%2C64.06%2C0%2C39.025%2C29.701%2C63.814%2C67.497%2C63.814%2C17.811%2C0%2C41.274-5.728%2C54.305-21.873%2C1.34-1.662%2C1.265-4.055-.256-5.553l-12.331-12.142c-1.564-1.539-4.092-1.584-5.651-.04-10.061%2C9.968-22.898%2C13.836-34.595%2C13.836-18.162%2C0-33.38-10.063-35.341-30.433h91.747c1.012%2C0%2C1.89-.738%2C2.024-1.742%2C.316-2.39%2C.476-4.873%2C.476-7.832%2C0-18.651-6.627-33.87-17.919-44.912Zm-76.085%2C34.112c2.212-16.444%2C13.747-26.507%2C30.437-26.507%2C8.834%2C0%2C16.444%2C2.947%2C21.841%2C8.592%2C4.173%2C4.662%2C7.363%2C10.553%2C8.345%2C17.915h-60.623Z%22%20style%3D%22fill%3A%20rgb(17%2C%20140%2C%20253)%20!important%3B%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M690.309%2C138.423c.008-.053%2C.003-.107%2C.011-.16h-6.357v-56.506h0V46.38c0-2.812-2.279-5.091-5.091-5.091h-18.824c-2.812%2C0-5.091%2C2.28-5.091%2C5.091v8.858c-10.794-10.282-25.255-16.65-41.923-16.65-36.817%2C0-62.588%2C27.49-62.588%2C64.06%2C0%2C36.077%2C25.529%2C63.814%2C62.588%2C63.814%2C18.896%2C0%2C33.375-7.855%2C43.684-19.631v4.958c0%2C6.749%2C5.471%2C12.219%2C12.219%2C12.219h20.583c2.812%2C0%2C5.091-2.28%2C5.091-5.091v-15.561c0-2.532-1.881-4.539-4.302-4.932Zm-71.878-.677c-20.123%2C0-34.606-15.465-34.606-35.099%2C0-19.88%2C14.483-35.341%2C34.606-35.341%2C18.162%2C0%2C34.116%2C12.76%2C34.116%2C35.341%2C0%2C22.335-15.954%2C35.099-34.116%2C35.099Z%22%20style%3D%22fill%3A%20rgb(17%2C%20140%2C%20253)%20!important%3B%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M1063.068%2C138.264h-9.168v-47.151c0-31.416-19.88-52.525-50.317-52.525-18.405%2C0-32.641%2C7.609-42.215%2C18.902-8.341-12.028-21.841-18.902-39.267-18.902s-30.385%2C7.462-38.979%2C18.556v-11.007c0-2.812-2.28-5.091-5.091-5.091h-18.824c-2.812%2C0-5.091%2C2.279-5.091%2C5.091v108.33c0%2C5.269%2C4.271%2C9.54%2C9.54%2C9.54h33.731c2.812%2C0%2C5.091-2.279%2C5.091-5.091v-15.561c0-2.812-2.279-5.091-5.091-5.091h-9.155v-44.45c0-15.954%2C10.306-26.018%2C25.278-26.018%2C14.729%2C0%2C23.317%2C10.063%2C23.317%2C26.018v60.653c0%2C5.269%2C4.271%2C9.54%2C9.54%2C9.54h30.158c2.798%2C0%2C5.067-2.268%2C5.067-5.067v-15.61c0-2.798-2.269-5.067-5.067-5.067h-5.581v-44.45c0-15.954%2C10.553-26.018%2C25.278-26.018s23.564%2C10.063%2C23.564%2C26.018v44.45l.013%2C12.723v3.48c0%2C5.269%2C4.271%2C9.54%2C9.54%2C9.54h33.731c2.812%2C0%2C5.091-2.279%2C5.091-5.091v-15.561c0-2.812-2.28-5.091-5.091-5.091Z%22%20style%3D%22fill%3A%20rgb(17%2C%20140%2C%20253)%20!important%3B%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M822.771%2C.023h-27.431c-2.812%2C0-5.092%2C2.28-5.092%2C5.091v15.561c0%2C2.812%2C2.28%2C5.091%2C5.092%2C5.091h1.453c-.001%2C.009%2C0%2C.018-.001%2C.028h4.086v25.068c-10.063-7.609-22.581-12.275-36.817-12.275-36.813%2C0-62.585%2C27.49-62.585%2C64.06%2C0%2C36.077%2C25.525%2C63.814%2C62.585%2C63.814%2C17.858%2C0%2C31.725-7.063%2C41.899-17.774v10.228c0%2C2.812%2C2.28%2C5.091%2C5.091%2C5.091h18.824c2.812%2C0%2C5.091-2.279%2C5.091-5.091v-17.109c.008%2C0%2C.015-.004%2C.023-.005V12.242c0-6.749-5.471-12.219-12.219-12.219Zm-53.309%2C137.724c-20.127%2C0-34.606-15.465-34.606-35.099%2C0-19.88%2C14.479-35.341%2C34.606-35.341%2C18.162%2C0%2C34.112%2C12.76%2C34.112%2C35.341%2C0%2C22.335-15.95%2C35.099-34.112%2C35.099Z%22%20style%3D%22fill%3A%20rgb(17%2C%20140%2C%20253)%20!important%3B%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M225.466%2C29.543h-59.576c-20.931%2C0-38.411%2C14.655-42.819%2C34.255-4.407-19.6-21.886-34.255-42.818-34.255H20.677C9.257%2C29.543%2C0%2C38.8%2C0%2C50.219v104.829c0%2C11.42%2C9.257%2C20.677%2C20.677%2C20.677H60.209s.001%2C.001%2C.002%2C.001c41.229%2C.126%2C54.747%2C9.808%2C61.262%2C29.595%2C.268%2C.611%2C.889%2C1.055%2C1.599%2C1.055%2C.713%2C0%2C1.331-.439%2C1.597-1.055%2C6.513-19.787%2C20.034-29.469%2C61.262-29.595%2C.001%2C0%2C.001-.001%2C.002-.001h39.534c11.42%2C0%2C20.677-9.257%2C20.677-20.677V50.219c0-11.419-9.257-20.677-20.677-20.677Zm-122.185%2C112.293c0%2C1.219-.988%2C2.207-2.207%2C2.207H33.738c-1.219%2C0-2.207-.988-2.207-2.207v-8.38c0-1.219%2C.988-2.207%2C2.207-2.207H101.074c1.219%2C0%2C2.207%2C.988%2C2.207%2C2.207v8.38Zm0-26.083c0%2C1.219-.988%2C2.207-2.207%2C2.207H33.738c-1.219%2C0-2.207-.988-2.207-2.207v-8.38c0-1.219%2C.988-2.207%2C2.207-2.207H101.074c1.219%2C0%2C2.207%2C.988%2C2.207%2C2.207v8.38Zm0-26.083c0%2C1.219-.988%2C2.207-2.207%2C2.207H33.738c-1.219%2C0-2.207-.988-2.207-2.207v-8.38c0-1.219%2C.988-2.207%2C2.207-2.207H101.074c1.219%2C0%2C2.207%2C.988%2C2.207%2C2.207v8.38Zm111.33%2C52.166c0%2C1.219-.988%2C2.207-2.207%2C2.207h-67.334c-1.219%2C0-2.207-.988-2.207-2.207v-8.38c0-1.219%2C.988-2.207%2C2.207-2.207h67.334c1.219%2C0%2C2.207%2C.988%2C2.207%2C2.207v8.38Zm0-26.083c0%2C1.219-.988%2C2.207-2.207%2C2.207h-67.334c-1.219%2C0-2.207-.988-2.207-2.207v-8.38c0-1.219%2C.988-2.207%2C2.207-2.207h67.334c1.219%2C0%2C2.207%2C.988%2C2.207%2C2.207v8.38Zm0-26.083c0%2C1.219-.988%2C2.207-2.207%2C2.207h-67.334c-1.219%2C0-2.207-.988-2.207-2.207v-8.38c0-1.219%2C.988-2.207%2C2.207-2.207h67.334c1.219%2C0%2C2.207%2C.988%2C2.207%2C2.207v8.38Z%22%20style%3D%22fill%3A%20rgb(17%2C%20140%2C%20253)%20!important%3B%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M414.034%2C44.915c-3.989-2.687-13.364-7.221-30.408-6.327-15.445%2C.81-27.49%2C8.102-35.589%2C21.109v-2.454c0-.033-.004-.059-.004-.091v-3.648c0-6.749-5.471-12.22-12.22-12.22h-26.614c-2.812%2C0-5.091%2C2.279-5.091%2C5.091v16.079c0%2C2.812%2C2.28%2C5.091%2C5.091%2C5.091h4.693s-1.979%2C.002-1.981%2C.003h2.742s.004%2C.002%2C.006%2C.002h5.64v70.713h-9.144c-2.785%2C0-5.042%2C2.258-5.042%2C5.042v15.66c0%2C2.784%2C2.257%2C5.041%2C5.041%2C5.041h52.385c2.784%2C0%2C5.04-2.257%2C5.04-5.04v-15.662c0-2.784-2.257-5.041-5.041-5.041h-9.123v-40.277c0-17.183%2C10.085-28.875%2C26.26-29.697%2C7.531-.383%2C12.856%2C.768%2C16.122%2C1.869%2C.91%2C.307%2C1.86-.156%2C2.262-1.027%2C3.742-8.106%2C8.877-15.263%2C15.171-21.278%2C.884-.845%2C.814-2.254-.2-2.937Z%22%20style%3D%22fill%3A%20rgb(17%2C%20140%2C%20253)%20!important%3B%22%2F%3E%3C%2Fsvg%3E)

Logo

Favicon

Social Card

UI Components

Live previews rendered using ReadMe's actual button styles.

Input

• background: transparent
• textColor: #384248
• borderColor: null
• borderRadius: 0px
• shadow: none

Button Primary

• background: #E95F6A
• textColor: #FFFFFF
• borderColor: #E6E6E6
• borderRadius: 6px
• shadow: rgba(255, 255, 255, 0.25) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.1) 0px -1px 1px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px

Button Secondary

• background: #FFFFFF
• textColor: #118CFD
• borderColor: #CFDFEB
• borderRadius: 10px
• shadow: rgba(0, 0, 0, 0.075) 0px -1px 2px 0px inset, rgba(255, 255, 255, 0.25) 0px 1px 0px 0px inset

Brand Personality

• Tone: modern
• Energy: medium
• Audience: developers and tech companies

ReadMe Brand in the Wild

Real-world brand assets — ads, campaigns, and marketing materials.

Image: files.readme.io Source: docs.readme.com

Image: readme.com Source: readme.com

Image: blog.readme.com Source: blog.readme.com

Image: blog.readme.com Source: blog.readme.com

Image: readme.com Source: readme.com

Image: blog.readme.com Source: blog.readme.com

Frequently Asked Questions

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

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

What font does ReadMe use?
ReadMe uses Segoe UI as the primary typeface across body and headings.

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

Where can I find ReadMe's logo?
ReadMe's logo is available directly on their site (http://readme.com). 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 http://readme.com 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 ReadMe.