Light
Dark
Graphic Assets
- Color Gradient: Primarily for digital display on screens.
- Color Solid: Primarily for color printing on physical media.
- Monochrome Black: Primarily for monochrome printing on light backgrounds.
- Monochrome White: Primarily for monochrome printing on dark backgrounds.
Isologo
Default
Isologo / Base / Color / Gradient / Clear
DownloadLegacy
Isologo / Base / Color / Solid / Clear
Download
Isologo / Base / Monochrome / Black / Clear
Download
Isologo / Base / Monochrome / White / Clear
DownloadIsologo (Full)
Isologo / Full / Color / Gradient / Clear
Download
Isologo / Full / Color / Solid / Clear
Download
Isologo / Full / Monochrome / Black / Clear
Download
Isologo / Full / Monochrome / White / Clear
DownloadImagotype
Default
Imagotype / Base / Color / Gradient / Dark
Download
Imagotype / Base / Color / Gradient / Light
Download
Imagotype / Base / Color / Gradient / Clear
DownloadLegacy
Imagotype / Base / Color / Solid / Dark
Download
Imagotype / Base / Color / Solid / Light
Download
Imagotype / Base / Color / Solid / Clear
Download
Imagotype / Base / Monochrome / Black / Light
Download
Imagotype / Base / Monochrome / Black / Clear
Download
Imagotype / Base / Monochrome / White / Dark
Download
Imagotype / Base / Monochrome / White / Clear
DownloadImagotype (Full)
Imagotype / Full / Color / Gradient / Dark
Download
Imagotype / Full / Color / Gradient / Light
Download
Imagotype / Full / Color / Gradient / Clear
Download
Imagotype / Full / Color / Solid / Dark
Download
Imagotype / Full / Color / Solid / Light
Download
Imagotype / Full / Color / Solid / Clear
Download
Imagotype / Full / Monochrome / Black / Light
Download
Imagotype / Full / Monochrome / Black / Clear
Download
Imagotype / Full / Monochrome / White / Dark
Download
Imagotype / Full / Monochrome / White / Clear
DownloadIsotype
Isotype / Base / Color / Solid / Clear
Download
Isotype / Base / Monochrome / Black / Clear
Download
Isotype / Base / Monochrome / White / Clear
DownloadLogotype
Logotype / Base / Color / Gradient / Clear
Download
Logotype / Base / Color / Solid / Clear
Download
Logotype / Base / Monochrome / Black / Clear
Download
Logotype / Base / Monochrome / White / Clear
DownloadLogotype (Full)
Logotype / Full / Color / Gradient / Clear
Download
Logotype / Full / Color / Solid / Clear
Download
Logotype / Full / Monochrome / Black / Clear
Download
Logotype / Full / Monochrome / White / Clear
DownloadHero Animation
Animated / Light
Download
Animated / Dark
DownloadFirst Frame / Light
DownloadFirst Frame / Dark
DownloadBands & Leaning Plates
Color Palette
Color Codes (Hex)
Blue / Light#00b0f0
Blue / Dark#0070c0
Orange / Light#ffaa00
Gray / Lighter#dbdbdb
Gray / Light#565658
Gray / Medium#474747
Gray / Dark#343436
Gray / Darker#242424
Product Colors
- Each of the six products has an accent color, its base, from which one rule derives four more shades, so that its numbers, icons, and cards read well in the light and the dark theme alike.
- The product colors mark only the products, so the logos, the bands, the stripes, and the brand gradient keep the color palette above.
Shades & Rules
TintThe base at 10% over white fills the card of the product on a light background, with a border at 30%.
BrightThe base made at least 0.10 lighter in OKLCH lightness sets numbers, icons, and text on a dark background at a contrast of 4.6:1 or more.
BaseThe accent of the product fills its bars and rules, with text on it in white or dark gray, whichever reads better.
StrongThe base made at least 0.10 darker in OKLCH lightness sets numbers, icons, and text on white or on the tint at a contrast of 4.6:1 or more.
DeepThe base at 16% over #171717 fills the card of the product on a dark background, with a border at 40%.
Product Color Codes (Hex)
01Brand cyan
Coarobo ViewportPhysical AI Visualization
- Tint#e6f7fe
- Bright#72ceff
- Base#00b0f0
- Strong#0276a2
- Deep#132f3a
02Mint green
Coarobo SightlineImmersive XR Teleoperation
- Tint#e8f9f3
- Bright#4fdfa3
- Base#1dbe84
- Strong#017f55
- Deep#183228
03Amethyst purple
Coarobo HeartbeatLiving Interactive Avatar
- Tint#f4edf8
- Bright#b272e1
- Base#8e4fbb
- Strong#70309b
- Deep#2a2031
04Brand blue
Coarobo DrydockRobotics System Integration
- Tint#e6f1f9
- Bright#3792e5
- Base#0070c0
- Strong#015391
- Deep#132532
05Torii vermilion
Coarobo GatewayConnected Cloud Infrastructure
- Tint#fbebe7
- Bright#fa5d39
- Base#d63911
- Strong#a82601
- Deep#361c16
06Brand amber
Coarobo LaunchpadExpert R&D Consultation
- Tint#fff7e6
- Bright#ffd7a5
- Base#ffaa00
- Strong#996401
- Deep#3c2f13
Product Icons
- Coarobo and each of its six products have an app icon in the isometric style of the website: the chevrons of the isotype stand on either side of an object that evokes the product, on a tile in the colors of the product.
- Each icon comes in a light appearance for light backgrounds and a dark appearance for dark backgrounds, and in three cuts, each drawn for the sizes it is shown at.
App Icons
- Light
Dark
- Light
Dark
- Light
Dark
- Light
Dark
- Light
Dark
- Light
Dark
Cuts & Rules
Main51264 px and upThe full drawing, for app stores, home screens, slides, and heroes.
Small3232 to 64 pxHeavier lines and larger objects, for menus, lists, and cards.
Tiny1616 to 32 pxThe object alone and larger, on a plain stage, for browser tabs and footers.
- Use the files as drawn, and never redraw, recolor, stretch, crop, or add effects to an icon.
- Pick the cut whose range holds the size shown, so that no cut is shown below its smallest size and no small cut is enlarged into a large icon.
- Leave clear space around the tile of at least an eighth of its side, with no text or other mark over it.
- Use the light appearance on a light background and the dark appearance on a dark one.