Ayu

v2.3.4

Warm, elegant theme inspired by the Ayu editor color scheme with golden accents

Package
Font
Monda
Light Dark Custom Font

Variants

Mirage
dist/ayu.css

Bluish dark backgrounds with warm golden accents

Mode accent background header sidebar surface text
Dark (default)
#e6b450
#1f2430
#191e2a
#242936
#242936
#cccac2
Dark
pa-color-dark dist/ayu.css

Deep black backgrounds with warm golden accents

Mode accent background header sidebar surface text
Dark (default)
#e6b450
#0b0e14
#0d1017
#0d1017
#131721
#bfbdb6
Light
pa-color-light dist/ayu.css

Clean light backgrounds with warm orange accents

Mode accent background header sidebar surface text
Light (default)
#f29718
#fcfcfc
#191e2a
#f8f8f8
#ffffff
#575f66

Ayu

A warm, elegant theme inspired by the popular Ayu color scheme for code editors. Golden accents on carefully tuned backgrounds create a distinctive, eye-friendly interface.

Highlights

  • Three variants — Mirage (bluish dark, default), Dark (deep blacks), and Light
  • Golden accent (#e6b450) for a warm, inviting feel
  • System fonts — no custom font download required

Variants

Switch variants by adding a CSS class to <body>:

<body>                          <!-- Mirage (default) -->

<body class="pa-color-dark">    <!-- Deep dark -->

<body class="pa-color-light">   <!-- Light -->

Usage

<link rel="stylesheet" href="css/ayu.css">