Docsome

Zero to docs under 15 seconds.

If you are a builder and don't want to spend too much time on documentation maintenance, you are in the right place. All you have to do is create one good Markdown file and run Docsome to transform it into attractive documentation.

Introduction

Getting Started

Prerequisites

Node.js
Terminal

Building

Docsome ships with a CLI (command-line interface) that requires only a single Markdown file to start building your documentation:

npx docsome build DOCS.md

or use Bun:

bunx docsome build DOCS.md

Development

For your convenience, the CLI ships with a development server so you don't have to build docs each time you make a change to your Markdown. Run it with:

npx docsome dev DOCS.md

or use Bun:

bunx docsome dev DOCS.md

Features

Docsome is a documentation framework that requires you to maintain only a single Markdown file. Everything else is abstracted and handled by the tooling. While this limits your ability to adjust the setup, there is still configuration that allows you to tweak the documentation.

| foo | bar |
| --- | --- |
| baz | bim |

Result

foo	bar
baz	bim

Task list items

Code

- [x] Fix the kitchen sink
- [ ] Deploy to production

Result

Fix the kitchen sink
Deploy to production

Mermaid

graph LR
    A --- B
    B-->C
    B-->D

Math

\f x = \int_{- \infty}^{\infty} \f \hat{ξ} e^{2 πi ξ x} d ξ

lang: en # Language of the site, set to <html> tag [default: en]
title: Custom Title # Display name of the tab [default: Docsome]
description: My new site # Meta description of the site
base: /docs/ # Base URL of the site

Logo

Automatic adjustement to color mode

logo:
  src: BASE64_OF_SVG_FILE # Base 64 encoded SVG file [default: PHN...mc+]
  invertible: true # If logo colors should invert in the dark mode [default: false]
  alt: My site's logo # Alt text for the logo

Custom logo for both color modes

logo:
  src:
    light: BASE64_OF_SVG_FILE # Base 64 encoded light logo SVG file
    dark: BASE64_OF_SVG_FILE # Base 64 encoded dark logo SVG file

Head

head:
  # Define additional script
  - tag: script
    attrs:
      - defer: true
      - src: https://example.com/script.js
      - data-website-id: 123asd
  # Define additional, external styles
  - tag: link
    attrs:
      - rel: stylesheet
      - href: https://example.com/style.css
  # Define additional, inline script
  - tag: script
    content: |
      window.test('init', {
        clientId: 'YOUR_CLIENT_ID',
      });

Top Bar

topBar:
  links: # Additional links to display in the top bar
    - icon: github # Button's icon [enum: github, twitter, linkedin, facebook, twitch, globe]
      href: https://github.com/guarana-studio
  llms: true # If llms.txt button should be shown in the top bar [default: false]

sideBar:
  linkGroups: # Groups of additional links in the side bar
    - label: Legals
      links: # Additional links
        - href: https://example.com/privacy
          label: Privacy Policy
        - href: https://example.com/terms
          label: Terms of Service

footer:
  text: Copyright © %YEAR% ACME # Text or HTML to display at the bottom of the page

Announcement

announcement:
  text: Announcement text # Text to display in the announcement
  href: https://example.com # Link to open on announcement click

AI content search
Code highlighting theme settings
Toggle for serif font
Custom scripts and styles in <head>

Done

Code highlighting
Mermaid integration
KaTeX integration

Showcase

Nightly build

There are experimental builds of Docsome availabe.