Supportsheep brand system
Support that scales.
Supportsheep interviews people, drafts useful support content, and keeps publication work clear. People stay in control of review and approval.
Character and voice
Write like a capable support partner. Be helpful, direct, calm, and technically precise. Stay friendly without sounding childish.
Lead with the task
- Use sentence case and the name Supportsheep.
- Prefer the verbs Interview, Draft, Review, Publish, and Answer.
- Describe the support outcome before the automation.
State the real control
- Say when a person must review or approve a result.
- When approval is required, call work “ready for review.”
- Never claim autonomy, approval, or publication that did not occur.
The Sheep mark
SheepMark is the primary Supportsheep product symbol. Reuse the component in product UI, navigation, and compact brand placements. It may inherit currentColor.
- Keep open space around the face and wool silhouette.
- Give meaningful uses an accessible label. Hide decorative uses.
- Do not stretch, crop, rotate, redraw, or add effects.
- Do not add costumes, expressions, speech bubbles, or another mascot.
- Do not use a robot, animal illustration, or emoji as a substitute.
Core color palette
Dusk Violet anchors the palette. Use semantic tokens in product UI. Use exact values only for approved brand assets and fixed surfaces.
Dusk Violet
The central brand anchor for buttons, core actions, and primary focus rings.
Dusk Amber
A warm highlight color used for gentle focus states, active badges, and hover fills.
Neutral Light
Faint violet cast (OKLCH hue 285) to keep standard surfaces warm and on-brand.
Neutral Dark
The deep night mode surface representing the calm, focused environment of the dusk theme.
- Asset field
- #6D4AFF
- Primary · light
- oklch(0.55 0.23 285)
- Primary · dark
- oklch(0.68 0.2 285)
- Canvas · light
- oklch(0.99 0.004 285)
- Canvas · dark
- oklch(0.16 0.025 285)
- Accent · light
- oklch(0.96 0.04 75)
Typography
Use Geist Sans for product UI, Geist Mono for code and data, and IBM Plex Sans for the apex marketing site. Tenant fonts remain controlled by tenant settings.
Type rendering rules
Balance display headings and use pretty wrapping for body copy. Use tabular figures for numeric tables. Reserve monospace for code, data, identifiers, and measurements.
Companion mascot pack
Vibebrand generated this separate companion illustration system from a source configuration named supportsheep.avatar.json. That source file is not stored in this repository. The pack does not come from SheepMark. Keep generated assets in branding/. Copy only selected runtime files to apps/web/public/.
- Browser:
favicon.svgandapple-touch-180.svg. - App:
icon-512.svgandicon-maskable-512.svg. - Marks:
logo-on-brand.svg,mark-transparent.svg, andmark-outline.svg. - Social:
profile-512.svg,profile-square-512.svg,og-1200x630.svg, and social covers.
Use the pack only in its supplied contexts: browser and app icons, or composed marketing and social assets. Preserve its proportions, safe area, and source color. Give meaningful images an accessible name at the point of use. Hide decorative images from assistive technology. The supplied mark-outline.svg treatment is approved. It does not replace SheepMark in product UI.
Accessible by default
- Meet WCAG AA contrast for text, controls, and focus states.
- Do not use color as the only signal for status or action.
- Keep keyboard focus visible and preserve semantic heading order.
- Respect reduced-motion settings and label meaningful images.
Do and don't
Do
Show the next task, the current state, and who controls the result.
Don't
Use inflated AI claims, childish sheep jokes, or decorative mascot variants.
Fixed platform and configurable tenants
Supportsheep marketing and product UI use fixed platform tokens. Each tenant controls public blog colors, headers, footers, logos, and fonts through config.publicAppearance. Never let tenant styles leak into the Supportsheep interface.