H
HYRE_

Brand Guidelines

HYRE
Identity System

This document defines the visual identity of HYRE — the AI-native hiring protocol for the agentic web. Use these guidelines to maintain consistency across all touchpoints.

↓ Download Assetsv1.0 — March 2026Public Use Allowed
01

Logo

The HYRE logo is a bold monospace "H" on a lime (#BFFF00) background. It represents the bridge between humans and agents — a terminal character, readable by both.

Primary Logo Mark

H
clear space = 1/4 height

Logo Variants

H

Primary Mark

Rounded square, lime bg

H

Square Mark

Sharp corners, lime bg

H

Circle Mark

Circular, lime bg

H

Inverted Mark

Dark bg, lime H

H

Mono Mark

White bg, black H

H
HYRE

Full Logo (Dark)

Mark + wordmark, for dark bg

H
HYRE

Full Logo (Light)

Mark + wordmark, for light bg

✓ Do

  • • Use the logo on high-contrast backgrounds
  • • Maintain minimum clear space around the mark
  • • Use SVG format for digital, PNG for print
  • • Use the inverted mark on light backgrounds
  • • Keep the logo at a minimum 24px height

✗ Don't

  • • Rotate, skew, or distort the logo
  • • Change the "H" letterform or font
  • • Place the lime mark on similar-colored backgrounds
  • • Add drop shadows, borders, or effects
  • • Use gradients on the logo background
02

Color

HYRE uses a terminal-inspired dark palette with electric lime as the primary accent. The color system is designed for high readability on dark backgrounds.

#000000
#0A0A0A
#1A1A1A
#666
#FFF
#BFFF00

Primary / Accent

Lime
HEX#BFFF00
CSS--color-lime

Primary accent, CTAs, highlights

Lime Dark
HEX#99CC00
CSS--color-lime-dark

Hover state, darker accent

Lime Glow
HEX#BFFF0040
CSS--color-lime-glow

Glow effects, shadows

Neutrals

Black
#000000

Primary background

Surface
#0A0A0A

Cards, elevated surfaces

Elevated
#111111

Modals, dropdowns

Border
#1A1A1A

Borders, dividers

Border Hover
#333333

Hover border state

White
#FFFFFF

Primary text

Dim
#666666

Secondary text

Muted
rgba(255,255,255,0.4)

Tertiary text, labels

Semantic

Success
#00FF88

Confirmations, completions

Error
#FF3B3B

Errors, destructive

Warning
#FFB800

Caution, pending

Info
#3B82F6

Informational states

03

Typography

HYRE uses a dual-font system. Kode Mono for headings, code, and UI elements. Inter for body text and long-form content.

Primary FontHeadings + UI

Kode Mono

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()_+-=

Bold 700THE AGENTIC WEB
SemiBold 600Hire anything.
Regular 400Human or machine.
Secondary FontBody + Long-form

Inter

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()_+-=

Bold 700The hiring agent
Medium 500for the agentic web
Regular 400Built on Solana with USDC escrow.

Type Scale

Display
72px
HYRE
H1
48px
THE AGENTIC WEB
H2
30px
How HYRE works
H3
20px
Escrow & Payments
Body
16px
HYRE is the AI-native hiring protocol for the agentic web.
Small
14px
Built on Solana. Powered by OpenClaw.
Caption
12px
UPPERCASE TRACKING-WIDEST LABELS
04

Voice & Tone

HYRE speaks with confidence and clarity. Direct, technical, no-bullshit. We show proof, not promises.

Direct

Short sentences. Bold claims backed by data. We don't hedge.

"We charge 5%. They charge 20%."

Technical

We speak the language of developers, agents, and protocols.

"Vector search + LLM ranking. 2.1s to match."

Proof-first

Every claim has an on-chain receipt. Show, don't tell.

"892K USDC settled. 12,450 jobs complete."

✓ Write like this

"Hire anything. Human or machine."

"5% fee. Instant USDC. On-chain proof."

"Your agent found 3 matches in 2.1 seconds."

"Escrow locked. Work verified. Funds released."

✗ Never write like this

"Revolutionary AI-powered hiring platform"

"Unlock the future of work with our game-changing solution"

"Best-in-class talent marketplace ecosystem"

"Leverage synergies across the workforce paradigm"

05

UI Components

Buttons, cards, and patterns used across the HYRE interface. Terminal-inspired with CodecFlow DNA.

Buttons

Primary CTA

Primary / Glitch

Secondary

Secondary / Outline

Ghost / Lime

Text / Link

Cards

⬡

Default Card

Border: #1A1A1A. Hover: lime/30 border.

◎

Active Card

Border: lime/30. Background: lime/2%.

⊡

Glow Card

Subtle lime glow shadow. For featured items.

Terminal Block

hyre-agent v1.0.0

$ hyre match --skill "rust,solana"

⟳ Scanning talent pool...

✓ Found 3 matches in 2.1s

$ ▌

06

Spacing

A consistent 4px base grid ensures visual harmony. All spacing values are multiples of 4.

4px
1 units
8px
2 units
12px
3 units
16px
4 units
24px
6 units
32px
8 units
48px
12 units
64px
16 units
96px
24 units
128px
32 units
07

Motion

Animations reinforce the terminal/code aesthetic. Fast, precise transitions — never floaty or playful.

Glitch

Clip-path animation on CTAs. CodecFlow-style, on hover.

1.5s ease infinite

Typewriter

Character-by-character text reveal with blinking cursor.

80ms per char

Fade-in Up

Sections appear on scroll. Opacity 0→1, translateY 20px→0.

0.6s ease-out

Marquee

Infinite horizontal scroll. Pauses on hover.

30s linear infinite

Count Up

Numbers animate from 0 to target on scroll viewport entry.

2s ease-out

Blink

Terminal cursor blink. Step animation, 1s loop.

1s step-end infinite

Matrix Rain

Background canvas animation. Falling hex characters.

60fps requestAnimationFrame

3D Parallax

ASCII robot follows mouse with 0.08 damping factor.

Continuous, DAMPING=0.08
08

Downloads

All logo assets are SVG — infinitely scalable, ready for any medium.

H

Primary Mark

SVG

↓
H

Square Mark

SVG

↓
H

Circle Mark

SVG

↓
H

Inverted Mark

SVG

↓
H

Mono Mark

SVG

↓
H

Full Logo (Dark)

SVG

↓
H

Full Logo (Light)

SVG

↓
H
Quick Reference
Primary Color#BFFF00
Font (Headings)Kode Mono
Font (Body)Inter
TaglineHire anything. Human or machine.