Skip to content

Wordmark

The brand's typographic mark — "Equestrianism" in Cormorant Garamond, optionally with a tool name in mono after a brass slash. There is no logo asset; this is the mark. Use in headers, footers, hero units.

jsx
<Wordmark size="lg" />
<Wordmark tool="stirrup" size="md" />
<Wordmark tool="chiron" onDark size="sm" />

Props: tool (lowercase tool name), size (sm/md/lg/xl), onDark (light treatment for ink backgrounds).

Preview

Declarations

TypeScript
export interface WordmarkProps {
  /** Optional tool name shown after a brass slash, e.g. "stirrup" (kept lowercase). */
  tool?: string | null;
  size?: 'sm' | 'md' | 'lg' | 'xl';
  /** Light treatment for dark/ink backgrounds. */
  onDark?: boolean;
  as?: 'span' | 'a' | 'div';
  className?: string;
}

/**
 * The Equestrianism wordmark: "Equestrianism" in Cormorant Garamond, optionally
 * followed by a tool name in mono. A typographic treatment, not a logo asset.
 */
export function Wordmark(props: WordmarkProps): React.JSX.Element;