# Able Potato brand guide

Version 6.0. September 15, 2026. Approved identity; family rollout in progress.

Able Potato is the umbrella identity replacing CleoWorks and its owl. Venture, Radar, and Fund keep their product names. The approved direction starts with Josh's supplied cyan potato, magenta cape, X profile `@AnAblePotato`, and signature line: **probably has a plan.**

This document describes the approved identity and its implementation rules. Josh approved the website direction and requested the family, domain, and GitHub migration. Each application and hostname is verified separately as that work proceeds. The interactive product examples remain illustrative rather than live workspaces. The previous CleoWorks v5 specification remains in `Brand-Language-Cyberpunk.md` as a historical reference.

## The idea

Able Potato makes useful work feel approachable. The character is capable, curious, and a little self-aware. Its calm expression and oversized cape carry the humor, leaving the interface free to explain what people can actually do.

The studio helps people find ideas, test assumptions, and take a next step. The signature line is a wink, not a guarantee that a tool has a correct answer. Keep uncertainty, evidence, source quality, and product availability clear.

## Identity and artwork

Write **Able Potato** in title case, with a space. Use real text for the wordmark. Use **Venture by Able Potato**, **Radar by Able Potato**, and **Fund by Able Potato** for product endorsement; make the product name primary inside its application.

The website wordmark sets Able in white, Potato in cyan, and a small decorative period in magenta, using Nunito Sans 900. Keep the signature line outside the header lockup. The written brand name itself remains Able Potato without required punctuation.

The primary character is the supplied hands-on-hips profile. The thumbs-up profile is a supporting pose for welcome and verified completion moments. These raster files are source artwork, not a prompt to trace a new mark. Preserve their proportions, colors, expressions, outlines, texture, and composition. Do not recolor, redraw, stretch, mirror, or apply CSS filters. Use the original files unchanged.

| File | Use |
| --- | --- |
| `assets/able-potato/profile.png` | Primary profile, website identity, product header. Hands-on-hips pose. |
| `assets/able-potato/profile-thumbs-up.png` | Supporting welcome or completion illustration. |
| `assets/able-potato/banner-art.png` | Supporting wide illustration without text. Place live responsive copy in the left open area; use the round profile for the homepage beam composition. |
| `assets/able-potato/banner-social.png` | Supplied social banner, including the original baked-in signature line. |

For a profile presentation, a circular CSS enclosure is allowed; preserve the complete character and do not crop away the cape or feet. Pair small product-header art, normally 40px to 48px, with a readable wordmark. The public homepage gives the identity more presence: a 68px portrait and 36px wordmark on desktop, scaling to a 46px portrait and 25px wordmark on narrow phones. Use a larger, clear portrait when the character itself is the subject. The guide's supporting images show the original art at its natural ratio.

Give lockups clear space at least one quarter of the profile image's displayed width. Keep enough room between the mark and the name to distinguish both. A compact horizontal lockup is preferred in navigation; the words may stack in a brand specimen. Do not add rings, a new emblem, or a second character to the primary lockup.

Use one focal character illustration per composition. Keep text, controls, and illustrations separate in the DOM. Decorative repeats next to an equivalent text name receive empty alt text. A standalone meaningful illustration gets a concise description. The social banner's alt text includes its baked-in signature line. Never make essential instructions available only as image text.

## Interface palette

The existing named interface colors are retained. The original colors inside the supplied PNG files are authorized artwork colors; they do not expand the interface palette.

| Role | Value | Use |
| --- | --- | --- |
| Canvas | `#050812` | Primary page background |
| Panel | `#0d111f` | Opaque reading and working surfaces |
| Cyan | `#26caee` | Primary action, borders, focus, connections, light |
| Magenta | `#d043a1` | Decorative atmosphere and restrained Bloom |
| White | `#ffffff` | Headings, essential text |
| Body text | `rgba(255,255,255,.82)` | Prose over dark surfaces |
| Secondary text | `rgba(255,255,255,.68)` | Supporting descriptions and metadata |
| Panel border | `rgba(38,202,238,.32)` | Quiet structural edges |
| Divider | `rgba(38,202,238,.16)` | Decorative section separation |

Cyan provides structure; magenta provides atmosphere. Use white or cyan for small essential text on panels. Magenta does not meet ordinary text AA contrast against every navy panel and is not an essential small-label color. Filled cyan actions use dark navy text. Test actual text and focus contrast after compositing backgrounds and glows.

Product applications retain their truthful semantic colors for errors, warnings, success, financial data, and other meaningful states. Brand accents do not replace those meanings. A selected panel glows because it is selected, not because its idea or score is better.

## Typography

Use **Nunito Sans** at weights 700, 800, and 900 for the wordmark, short headings, and product names. Rounded letterforms bring the character's friendliness into the page. Use 900 for large display text, 800 for component headings, and 700 where lighter emphasis is useful. Fall back to `ui-rounded, system-ui, sans-serif`.

Use system sans for prose, navigation, controls, form fields, tables, and longer explanations. Use restrained system monospace for URLs, source labels, dates, version information, and reference tokens. Keep long passages out of the display and monospace faces.

The guide uses body text at 16px, line height 1.65, and a reading measure of about 45 to 70 characters. Main body content must remain readable under text enlargement. Small supporting metadata may reach 12px where clearly secondary; meaningful instructions and working UI should stay at least 14px. Use responsive display sizes, allow labels and domains to wrap, and verify at 320px width and 200% zoom.

Preserve the exact lowercase signature line **probably has a plan.** wherever it is used as the signature. It works in a footer, profile banner, or character introduction. It does not replace the product explanation or become an error message.

## Voice

Speak with warmth, clarity, and modest confidence. Give someone a useful next step. A short playful line can introduce a surface; the work itself uses plain language.

| Moment | Example | Intent |
| --- | --- | --- |
| Welcome | Got a hunch? Let's see where it goes. | Invite curiosity without promising success. |
| Empty saved list | No saved ideas yet. Save one to come back to it. | Explain the state and the next action. |
| Load failure | We couldn't load your research. Try again. | Name the problem and a recovery action. |
| Real completion | Saved. Ready when you are. | Confirm only a state the product has verified. |
| Uncertainty | We don't have enough evidence yet. | Keep limitations visible. |

Avoid invented telemetry, inflated capability claims, pointless serial numbers, superhero promises, and constant potato jokes. Do not imply that decorative light measures a live system. Do not use em dashes. Explain important failures, investment research, evidence, and account actions calmly and precisely. Only say work was saved when the system confirms that it was.

## Product architecture

| Product | Description | Current destination |
| --- | --- | --- |
| Venture | For founders. Discover, test, and build your next business. | `https://venture.ablepotato.com` |
| Radar | Discover emerging product launches. | `https://radar.ablepotato.com` |
| Fund | Explore investment theses and evidence. | `https://fund.ablepotato.com` |

The studio identity is Able Potato. Keep the existing product names and use **by Able Potato** as a quiet endorsement beneath or beside the name. Use clearly named actions such as **Open Venture**, **Open Radar**, and **Open Fund** for real destinations. Links to illustrative product surfaces say **See product examples** or explicitly name the example.

Venture's Founder and Family experiences remain choices inside Venture. They are not separate umbrella products. Preserve the actual meaning, access behavior, and user context of each choice when adapting that application. Fund is investment research; branding must not imply portfolio management or trading execution.

| Surface | Approved direction | Protect |
| --- | --- | --- |
| Studio website | Character-led introduction, rounded display type, familiar cyan horizon, three clear product destinations | Truthful product descriptions and availability |
| Product entry | More generous character artwork and atmosphere, product name first | Authentication, choices, instructions, recovery paths |
| Venture workspace | Compact endorsed lockup, cyan controls, quiet panels, selected-panel Bloom | Source quality, evidence, decisions, and distinct states |
| Radar workspace | Compact lockup, readable launch lists and source details | Actual freshness, availability, and discovery context |
| Fund workspace | Compact lockup, opaque tables, subdued surrounding light | Data semantics, financial colors, score labels, research limitations |

The page at `/product-preview.html` demonstrates this direction using illustrative content. The requested family rollout covers the actual repositories with their own implementation, functional checks, and release procedures. A guide change alone does not publish an application change.

## Geometry, light, and states

Use soft corners: 12px on actions, 20px on standard panels, and 24px on larger feature surfaces. Use generous spacing, simple cyan outlines, readable white headings, and dark opaque content wells. Corners soften the frame without turning every item into a pill.

The approved homepage follows Fund's sign-in composition: the original round profile floats in front of a visible cyan focused cascade, with mist opening onto a soft horizon and restrained magenta atmosphere at the side. The light continues above and below the portrait. Use separate layers for the character, static backdrop, moving light, and live copy so the wide banner cannot obscure the beam. Keep the reading region dark, including a dark backing behind desktop navigation. Product entry screens use this same visual reference while preserving their own sign-in instructions and behavior.

The homepage uses `assets/fund-focused-cascade.js`, the same renderer as the approved Fund entry, with `assets/able-home-light.css` adapting its placement to the homepage. It aligns the beam to the portrait at each screen size. Keep the original artwork bytes and published palette. The wide banner remains a supporting editorial and social asset.

The reference selected-panel treatment combines a fixed cyan border, an optional inset cyan leading edge, and a static restrained Bloom: `0 0 20px rgba(208,67,161,.14), 18px 20px 60px -22px rgba(208,67,161,.24)`. A selected state also has explicit text or appropriate accessible state semantics. Glow is never the only indicator.

Use solid cyan fill with navy text for the strongest action and a cyan outline for a supporting action. Keep targets at least 44px high, with clear verbs and destination names. Preserve visible keyboard focus with a 2px cyan outline and 5px offset. Every example that looks interactive is a real link with a clear destination; static examples remain noninteractive.

The character, text, controls, and workspace content stay still. If the existing atmosphere uses slow decorative motion, it must not imply progress, scanning, evidence quality, or activity. Reduced motion removes decorative animation and transforms. Without JavaScript or graphics support, the static artwork and all primary navigation remain usable. Decorative animation should stop while offscreen or the page is hidden. No new motion engine is required for the brand guide; its examples are static.

High contrast and forced colors suppress decorative lighting, use explicit borders, and retain readable text and focus. Keep focus outlines outside clipped decorative enclosures. Printed reference material must remain readable. Dense product content stays on opaque panels rather than atmospheric image layers.

## Domains and rollout

The [Able Potato rollout plan](Able-Potato-Rollout.md) maps the remaining application surfaces, domain and mail setup, and staged migration checks from the read-only source audit.

Josh selected **ablepotato.com as the primary domain** and reports that `ablepotato.com`, `ablepotato.ai`, and `ablepotato.net` are acquired. Domain, hosting, and GitHub migration are part of the approved rollout. Verify DNS, redirects, hosting configuration, and HTTPS before treating a destination as live.

The website identity is live at `ablepotato.com`. The three product links now use their verified `ablepotato.com` hostnames. HTTPS login pages were checked on September 15, 2026; authenticated behavior and each application release are verified separately. Keep old URLs working during the transition. The new brand name does not require changes to working storage, session, or internal service identifiers.

Roll out by surface: configure and verify the selected primary domain, publish the approved website, prepare application-specific changes, verify functional and accessibility behavior, and then publish each migration through its release process. Keep old links working as required by the migration plan. Record deployed versions and hostname checks separately from this specification.

## Implementation and review

`brand.html` is the responsive guide. `assets/able-brand.css` styles it. `Able-Potato-Tokens.css` supplies its reference variables and can inform other implementations; products do not automatically inherit or deploy this file. The supplied original images live under `assets/able-potato/`. Runtime styles for the studio and product previews may remain separate, with their values checked against this reference.

Before publication, inspect the full desktop and mobile pages, 320px reflow, enlarged text, keyboard order, visible focus, no-JavaScript behavior, reduced motion, forced colors, and actual contrast. Confirm the name, supplied assets, product descriptions, current destinations, and rollout status. Preserve all supplied artwork bytes. Keep legacy brand guidance clearly marked as historical product context; v6 is the current identity.