Protobi

Post Editor

← All help posts

View post

<img src="/uploads/upload/image/5200/direct/1570044593240-1570044593240.png" alt="Overhead view of a designer in a green sweater working at a desk with a computer screen displaying "LOGO" text, holding physical color swatch cards in hand, with a digital tablet showing a grid of color palettes and a small potted plant nearby." style="width: 240px;" class="fr-fic fr-dib">

Part of the fun of delivering Protobi to clients is showing it in your colors and brand — or better yet, in theirs. Here's how...

# Set logo and splash images

The first step in any project is to set the logo and splash images. You can set these in the Overview tab in the Admin page.

<img src="/uploads/upload/image/5200/direct/1561571900186-overview%20(1).png" alt="Overview configuration form showing fields filled with "Colors and branding" for both Name and Brief title, "Additional details" as Description placeholder text, Logo URL pointing to "protobi-logo-c.png", and Image URL with blue border containing "brand.jpg" link." style="width: 360px;" class="fr-fic fr-dib">

The logo image appears in the upper left of the page. The splash image appears in the "baseball card" on the project listing.

<img src="/uploads/upload/image/5200/direct/1561571911940-baseball-card.png" alt="Project card interface with blue header displaying "Colors and branding" title, containing the same designer workspace thumbnail image. Below shows "Description" label with "Colors and branding" text, followed by three action buttons: "Open" with play icon, "Share" with people icon, and "Admin" with edit icon." style="width: 240px;" class="fr-fic fr-dib">

# Get brand colors

The next step is to get your brand colors, and more specifically, their sRGB hex codes. Somewhere there is a brand guide that has a page with something like this:

<img src="/uploads/upload/image/5200/direct/1561571928591-brand-colors.jpg" alt="Physical brand style guide document showing a color palette grid with labeled swatches including "Rising Sun #C9263D" in coral-red, "Berlin Thing #715373" in magenta-purple, "Tride #195BA5" in royal blue, and other colors with hex codes displayed on angled color blocks." style="width: 480px;" class="fr-fic fr-dib">

No matter how small the organization there is someone who's spent hours trying to make it easy for you to find this info and is more than willing to help you incorporate it correctly. A good first step is the company's home page under "Media" or Google. In a pinch you can use your computer's color meter app on their home page.

See Color tutorial for more details

Publishing

Date

Status

Slug edit

Content

Thumbnail

Categories Manage

Tools

AI Database

Danger zone