remark

A simple, in-browser, markdown-driven slideshow tool targeted at people who know their way around HTML and CSS, featuring:

Markdown formatting, with smart extensions
Presenter mode with markdown formatted speaker notes and cloned slideshow view
Syntax highlighting, supporting a range of languages
Slide scaling, thus similar appearance on all devices / resolutions
Simple markdown templates for customized slides
Touch support for smart phones and pads, i.e. swipe to navigate slides

Check out this remark slideshow for a brief introduction.

To render your Markdown-based slideshow on the fly, checkout Remarkise.

Getting Started

It takes only a few, simple steps to get up and running with remark:

Create an HTML file to contain your slideshow (see boilerplate below)
Open the HTML file in a decent browser
Edit the Markdown and/or CSS styles as needed, save and refresh!
Press C to clone a display; then press P to switch to presenter mode. Open help menu with h.

See any of the boilerplate-*.html files (the -local one requires building remark first), or just copy the boilerplate HTML below to start:

<!DOCTYPE html>
<html>
  <head>
    <title>Title</title>
    <meta charset="utf-8">
    <style>
      @import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
      @import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic);
      @import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic);

      body { font-family: 'Droid Serif'; }
      h1, h2, h3 {
        font-family: 'Yanone Kaffeesatz';
        font-weight: normal;
      }
      .remark-code, .remark-inline-code { font-family: 'Ubuntu Mono'; }
    </style>
  </head>
  <body>
    <textarea id="source">

class: center, middle

# Title

---

# Agenda

1. Introduction
2. Deep-dive
3. ...

---

# Introduction

    </textarea>
    <script src="https://remarkjs.com/downloads/remark-latest.min.js">
    </script>
    <script>
      var slideshow = remark.create();
    </script>
  </body>
</html>

How To Use remark

The wiki pages contain all the how-to, templating, and API help.

Real-world remark slideshows

On using remark:

Other interesting stuff:

Printing

Converting to PDF is primarily supported via Chrome's Print to PDF feature. Note that the styling is not exact; See #50 for some recommended CSS to add to your styles.

Alternatively, you can use DeckTape, a PDF exporter for HTML presentation frameworks that provides support for remark.

Contributors

Thanks goes to these people for their contributions:

Aaron Meurer
Adam Obeng
Adam Strzelecki
Aleksandar Trifunovic
Alexander Brett
Alex Claman
Alex Y. Wagner
Allan Jiang
Amin Bandali
Andrea Georgieva
Andrew Gaul
Andrey Ustyuzhanin
Antonin Stefanutti
Axel Rauschmayer
Baron Schwartz
Bastian Venthur
Bengt Lüers
Benjamin Stigsen
Bernát Kalló
bobappleyard
Brandon Keepers
Breno Polanski
Bruno Fagundez
bugdone
Cameron Daigle
Chris Kanich
Christian Dreier
Christopher McClellan
Christoph Gnip
cjwit
Claudio Bley
Daan van Berkel
Daniel Stankiewicz
Daniel Wang
Danny Tuppeny
Dan Steingart
datamike
Dave Henderson
David Richards
derickfay
Dirk Husemann
Erwann Mest
Fabian
Felix C. Stegerman
Florian Rathgeber
follower
Gerard Capes
gnab
Grégoire Pineau
Gurjeet Singh
Hadrien Frank Cardinal de Cuzey
Hiroshi Fukada
Hubert Chen
Hunter-Github
hydroid7
Ivo Wever
J_4lexander
Jason
Jason Underhill
Jérôme Petazzoni
Jimmy Merrild Krag
Joe Beda
Joel Porquet
Johannes Wienke
Julien Wajsberg
kellyoconor
kerim
kernc
Kim Joar Bekkelund
Lauro Caetano
Loreia
Marcel Schilling
Markus Schanz
Martin
Martin 'Hasan' Bramwell
Mathias Bynens
Matthew
Mears-UFL
mhor
Michael Byrne
Michael Grosser
Michael Mol
Michael Sanford
Mike Pennisi
Morton Fox
mrbald
Nicolas Hart
Oleksiy Syvokon
Ole Petter Bang
Ozan K
Pavel Boldyrev
Pedro
Pedro Martin
Peter Jausovec
petitviolet
Pi-Hsun Shih
pille1842
piranha
pospi
Psychos-Yi
punkish
Radovan Bast
Rahul Bansal
Rasmus Vestergaard Hansen
rasmusvhansen
Renato Alves
rglepe
Rich Trott
Roberto Soares
Robert Perce
Robert Szmurło
Robin Berjon
Rolf
Rostyk
Russell Keith-Magee
Ryan Thomson
Sarah Binney
Scott Hewitt
Sebastian Pipping
Sequoia McDowell
Shane Curcuru
Shaun Hammill
siba prasad samal
Simon Hengel
Stian Mathiassen
stu-b-doo
Sylvain Abélard
Takashi Kanemoto
Tej Chajed
Thomas Ballinger
Tobias Løfgren
Todd Brannam
Todd Gureckis
Tome Tanasovski
Tom Kraak
Torgeir Thoresen
tripu
vdepabk2t
William Ghelfi
Willi Rath
Wouter Sioen
Yihui Xie
Yinhe Zhang
Yohan Lasorsa
Yoshiya Hinosawa

License

remark is licensed under the MIT license. See LICENSE for further details.

Project Name	Stars	Repos Using This	Packages Using This	Most Recent Commit	Total Releases	Latest Release	Open Issues	License	Language
Remark	11,917	1	3	10 months ago	1	June 25, 2017	160	mit	HTML
A simple, in-browser, markdown-driven slideshow tool.
Nodeppt	9,325	9	4	2 years ago	105	June 28, 2020	17	mit	JavaScript
This is probably the best web presentation tool so far!
Gitpitch	5,225			2 years ago			8	mit	Python
Markdown Presentations for Tech Conferences, Training, Developer Advocates, and Educators.
Cleaver	3,916	67	4	a year ago	45	December 03, 2017	17	mit	JavaScript
30-second slideshows for hackers
Patat	1,905	2		a month ago	43	March 12, 2021	26	gpl-2.0	Haskell
Terminal-based presentations using Pandoc
Xaringan	1,401	22	14	3 months ago	25	June 14, 2022	37	other	CSS
Presentation Ninja 幻灯忍者 · 写轮眼
Showoff	924	368	3	a month ago	85	April 12, 2021	56	mit	JavaScript
Don't just present; interact with your audience!
Backslide	711	10		a year ago	27	March 15, 2022	15	mit	JavaScript
:sweat_drops: CLI tool for making HTML presentations with Remark.js using Markdown
Gatsby Starter Deck	498			3 years ago				mit	JavaScript
🗣 Create presentations using Gatsby, React & Markdown.
Hacker Slides	284			4 years ago		March 06, 2018	18	mit	Go
A small UI for building presentation slides from markdown markup