Brand assets, ready to save.

Full lockup, with ™, for Nocturne and dark photos.

Full lockup, with ™, for Daylight, documents and print.

R mark for avatars, favicons and watermarks on dark.

R mark on light grounds and in small print.

Continuous oscillation, for flow and movement.

One sharp spike, for metrics, status and “something happened”.

Flat run with checkpoints, for process and timelines.

Wave, pulse and node on one baseline. The primary brand device.

Track, fill and current node, for steps and carousels.

A rising trace to sit under a figure. Never add axis labels.

A quiet wave inside a hairline, for documents and email footers.

/* Rhytmelo color tokens: Nocturne (default) + Daylight */
:root, [data-theme="nocturne"] {
  --rh-bg: #161826;
  --rh-surface: #232532;
  --rh-line: #3F424D;
  --rh-muted: #9397AB;
  --rh-text: #E9E9ED;
  --rh-accent: #9184D9;
  --rh-accent-text: #D2CEFD;
  --rh-accent-tint: #2B2741;
  --rh-section: #262A60;
}
[data-theme="daylight"] {
  --rh-bg: #F3F5FE;
  --rh-surface: #E4E7F5;
  --rh-line: #CFD3E5;
  --rh-muted: #595D6C;
  --rh-text: #161826;
  --rh-accent: #796CBF;
  --rh-accent-text: #5D5294;
  --rh-accent-tint: #E7E5FE;
  --rh-section: #E7E5FE;
}
:root {
  --rh-neutral-100: #F3F5FE;
  --rh-neutral-200: #E4E7F5;
  --rh-neutral-300: #CFD3E5;
  --rh-neutral-400: #B2B6CA;
  --rh-neutral-500: #9397AB;
  --rh-neutral-600: #75798C;
  --rh-neutral-700: #595D6C;
  --rh-neutral-800: #3F424D;
  --rh-neutral-900: #292B31;
  --rh-accent-100: #F5F4FF;
  --rh-accent-200: #E7E5FE;
  --rh-accent-300: #D2CEFD;
  --rh-accent-400: #B5ABFC;
  --rh-accent-500: #968AE0;
  --rh-accent-600: #796CBF;
  --rh-accent-700: #5D5294;
  --rh-accent-800: #423A6A;
  --rh-accent-900: #2B2741;
  --rh-font: "Inter", system-ui, sans-serif;
}

{
  "font": {
    "family": "Inter",
    "weights": [
      400,
      500
    ]
  },
  "themes": {
    "nocturne": {
      "bg": "#161826",
      "surface": "#232532",
      "line": "#3F424D",
      "muted": "#9397AB",
      "text": "#E9E9ED",
      "accent": "#9184D9",
      "accent-text": "#D2CEFD",
      "accent-tint": "#2B2741",
      "section": "#262A60"
    },
    "daylight": {
      "bg": "#F3F5FE",
      "surface": "#E4E7F5",
      "line": "#CFD3E5",
      "muted": "#595D6C",
      "text": "#161826",
      "accent": "#796CBF",
      "accent-text": "#5D5294",
      "accent-tint": "#E7E5FE",
      "section": "#E7E5FE"
    }
  },
  "ramps": {
    "neutral": [
      "#F3F5FE",
      "#E4E7F5",
      "#CFD3E5",
      "#B2B6CA",
      "#9397AB",
      "#75798C",
      "#595D6C",
      "#3F424D",
      "#292B31"
    ],
    "accent": [
      "#F5F4FF",
      "#E7E5FE",
      "#D2CEFD",
      "#B5ABFC",
      "#968AE0",
      "#796CBF",
      "#5D5294",
      "#423A6A",
      "#2B2741"
    ]
  }
}

name,theme,hex,r,g,b,c,m,y,k
bg,nocturne,#161826,22,24,38,42,37,0,85
surface,nocturne,#232532,35,37,50,30,26,0,80
line,nocturne,#3F424D,63,66,77,18,14,0,70
muted,nocturne,#9397AB,147,151,171,14,12,0,33
text,nocturne,#E9E9ED,233,233,237,2,2,0,7
accent,nocturne,#9184D9,145,132,217,33,39,0,15
accent-text,nocturne,#D2CEFD,210,206,253,17,19,0,1
accent-tint,nocturne,#2B2741,43,39,65,34,40,0,75
section,nocturne,#262A60,38,42,96,60,56,0,62
bg,daylight,#F3F5FE,243,245,254,4,4,0,0
surface,daylight,#E4E7F5,228,231,245,7,6,0,4
line,daylight,#CFD3E5,207,211,229,10,8,0,10
muted,daylight,#595D6C,89,93,108,18,14,0,58
text,daylight,#161826,22,24,38,42,37,0,85
accent,daylight,#796CBF,121,108,191,37,43,0,25
accent-text,daylight,#5D5294,93,82,148,37,45,0,42
accent-tint,daylight,#E7E5FE,231,229,254,9,10,0,0
section,daylight,#E7E5FE,231,229,254,9,10,0,0