Beautiful Release Notes

A simple component to create a beautiful, responsive timeline of release notes. Use standard themes, or style with your own classes.


import { ReleaseNotes, Entry } from \

<ReleaseNotes theme="orange" title="Dot Changelog"
  subtitle="New features, fixes and improvements.">
  <Entry date="2022-03-08" version="1.3.2"
    # Release note 1
  <Entry date="2022-02-24" version="1.3.1"
    # Release note 2

Dot Changelog

New features, fixes and improvements.

March 8, 2022

New documentation website

Go to Docs to access the brand new Dots documentation! With extensive guides, examples, API docs, tips and more.

February 24, 2022

Quality of life improvements

  • Move project to another team.
  • Add option to disable auto-formatting.
  • Add option to disable render-on-type.
  • Create new file from folder.
  • Shortcut to create a new template.



The main page container containing each entry, and setting the theme, and optionally the page title and subtitle.

Supported properties

title and subtitleThese can be either strings or JSX components for further customization.
themeThe color theme of the changelog. Supported values are currently blue, fuchsia, orange, mono.
classNameList of class names of the container component.


Within the ReleaseNotes components, create Entry components for each of your release notes.

Supported properties

dateThe date of the release.
versionThe version of the release.
coverThe cover image to display at the top of the release note.