What is Xanadu?

Xanadu is Ted Nelson's visionary hypertext system—an interconnected web of knowledge where every link is bidirectional, every version is preserved, and every citation is permanent. This wiki channels that dream into a living technical document.

=>> Hypertext: more than linear prose
=>> Transclusion: embedding without copying
=>> Version control: all history preserved
=>> Quotation: citing with integrity

Neubrutalism + Neon

This interface is deliberate brutalism—thick borders, hard shadows, exposed structure. The neon accent color (Electric Lime) marks active elements and the timeline spine, suggesting late-night labs and phosphor screens.

// Color Palette
const palette = {
  background: '#f5f5f5',
  black: '#0a0a0a',
  accent: '#b5ff00',    // Electric Lime
  hover: '#00ffd5',     // Neon Cyan
  emphasis: '#ff00aa'   // Hot Magenta
}

Recursive: One Font, Many Voices

Recursive is a variable font spanning sans to monospace. Headings use the proportional, semi-casual setting. Body text is neutral and linear. Code is fully monospaced. All from one typeface family—a unified voice.

// Typography hierarchy
h1 { font: 800 clamp(2rem, 5vw, 3.6rem) Recursive; }
body { font: 400 clamp(1rem, 1.2vw, 1.15rem) Recursive; }
code { font-variation-settings: 'MONO' 1; }

Visceral, Physical Feedback

Cards press inward on hover—shadow reduces, position translates. No soft easing; snappy 150ms cubic-bezier curves. Commit dots pulse outward. The cursor trails phosphor afterimages. Everything feels mechanical and tactile.

// Card press effect
card:hover {
  box-shadow: 3px 3px 0px #0a0a0a;
  transform: translate(3px, 3px);
  transition: all 150ms cubic-bezier(0.2, 0, 0, 1);
}

Structural Skeleton

A subtle 48px grid underlays all content. Lines brighten on hover, revealing the engineering beneath. The grid is not decoration—it is the architectural blueprint, like graph paper an engineer sketches on.

// Grid substrate
background-image:
  repeating-linear-gradient(
    0deg, #d4d4d4 0, #d4d4d4 1px,
    transparent 1px, transparent 48px
  ),
  repeating-linear-gradient(
    90deg, #d4d4d4 0, #d4d4d4 1px,
    transparent 1px, transparent 48px
  );

Phosphor Pulses

Key structural elements glow with layered box-shadow and text-shadow, pulsing subtly over 4 seconds. The effect mimics neon tubes warming up, suggesting energy flowing through the system.

// Neon glow effect
.spine {
  box-shadow:
    0 0 8px #b5ff00,
    0 0 20px rgba(181, 255, 0, 0.4),
    0 0 40px rgba(181, 255, 0, 0.15);
  animation: neon-pulse 4s ease-in-out infinite;
}

Timeline Revelation

As you scroll, the timeline spine extends downward ahead of your scroll position. Cards fade and translate in as they enter the viewport. Content nodes connect alternately left and right, creating a zigzag history.

// Scroll-driven reveal
node.on('enter', () => {
  node.card.animate({
    opacity: [0, 1],
    transform: ['translateY(20px)', 'translateY(0)']
  }, 300ms)
})

Phosphor Trails

The cursor is followed by a small Electric Lime circle at 40% opacity, trailing fading ghost copies. On dark backgrounds, the trail switches to Neon Cyan. On touch devices, tapped elements emit a radial pulse instead.

// Cursor follower with lerp
requestAnimationFrame(() => {
  cursor.x += (mouse.x - cursor.x) * 0.12;
  cursor.y += (mouse.y - cursor.y) * 0.12;
  updateFollower(cursor.x, cursor.y);
})

Knowledge in Context

Code snippets are central to xanadu.wiki. They appear inset within cards with dark backgrounds, line numbers, and syntax highlighting. Keywords glow in Electric Lime. A "copy" button offers interaction without leaving the page.

// Code block styling
code {
  background: #1a1a1a;
  color: #f5f5f5;
  border: 1px solid #6b6b6b;
  padding: 20px;
  font-size: 0.88rem;
}
// Keywords glow
.keyword { color: #b5ff00; }

This Is the Journey

You are not reading a static page. You are traversing a history. Each entry is a node in a hypertext graph, a commit in the story of interconnected knowledge. The timeline is the spine; you are the cursor moving through time.

Last updated: 2026-03-15 | Version 1.0 | xanadu.wiki