.

presentations from markdown

How to create professional slides from Markdown notes

How to create professional slides from Markdown notes

The conference you signed up for is in two weeks, but you haven't started with the slides yet. Focusing on the content should be your top priority, so you start putting together an outline with Google Slides. Nevertheless, you quickly realize that formatting the presentation will take forever: choosing the right font, a background that fits, unique images ... why the spacing between elements is always inconsistent between slides?

I faced this situation when preparing the slides for my presentation on Docs as Code for PyCon APAC 2020. The clock was ticking, so I ended writing the slides in plain text while looking for an alternative to convert these annotations into visually appealing slides.

The tool I ended up choosing was Marp . At first, I was skeptical if Marp would offer the flexibility required to design slides using Markdown, but now I can say I'm happy with the result. So here is what I learned.

Creating the presentation

No matter which tool you use to create the presentation, the first step is to know what you want to explain. Once you have the topic, open a new file with the extension .md . Then, write your notes for your presentation in plain text using Markdown syntax.

New to Markdown? Here is a cheat sheet with the most common annotations you'll need to format titles, links, and tables.

Organizing the presentation

Once you have all the content outlined, split the slides with the annotation --- . Here is an example.

Creating slides with Marp

Marp is the framework we'll use to turn Markdown into a beautiful slide deck. Unfortunately, the tool is not available as a web application, so you'll need a bit of experience playing with the terminal to use the tool.

For example, try to run one of the following commands to convert a Markdown slide deck into HTML, PDF, or PTTX. Replace PITCHME.md with your file name.

Do you want to preview the slides while you edit the contents? To run Marp in watch mode , run the following command instead:

Then, open the resulting HTML file with your preferred browser.

If you use Visual Studio Code , you can preview the resulting slides as you write them with the Marp Extension for VSCode .

Adding a theme

Let's change the style of the presentation. You can use one of the built-in themes . At the top of the MarkDown file, define which theme you want to apply using the directive theme . The file header should look like this:

I've decided to go with the theme gaia for my presentation. Moreover, Marp provides other configurable directives that simultaneously apply to all the slides.

For example, I defined default values for the font color, background image, and enabled pagination for my presentation.

Styling a single slide

In some situations, you'll only want to enable a directive for a given slide. You can apply directives selectively with comments. The next code snippet shows how to disable pagination for the first slide.

Another common directive used per slide is _class . Each theme may come with a set of predefined classes. For example, the theme gaia introduces the class lead . When used, this centers the slide contents.

Using classes with Marp

As you can see, the first slide used the class centering the title, whereas the second slide didn't, and the contents appear aligned on top.

If you're a skilled CSS developer, you might want to create a custom theme from scratch. John Wadleigh explains how to do it in Custom themes with Marp .

Working with images

A picture speaks 1,000 words. Most presentations include images, and Marp extends Markdown to define their size.

Add an image to your slides and change the size with width and height options.

You can also apply filters to images, such as adding opacity, a shadow, or even rotating the image. Here you have all the available predefined CSS filters supported. For example, the following snippet shows how to convert a photo to grayscale mode.

Marp also brings the option to use images as backgrounds . Backgrounds also accept the same filters as images and additional options to position them.

By default, all background images fit the slide, but you can use the option auto to preserve the original size.

The options left or right position the background to the specified side.

Background left option

Final thoughts

Writing all the slides in Markdown has been fun! I felt much more efficient in creating the presentation. And, the outcome was better than other slide decks I made before using other WYSWYG tools.

On the other hand, it might not work for every presentation because mastering Marp has a learning curve. Indeed, I'd not feel comfortable with the tool if I had to compose a very intricate design.

Let's talk about docs.

Do you want to create great products for technical audiences? Dive into the topic with my articles on technical writing , developer experience , and Docs as Code .

Creating Presentations In Markdown With Marp

Creating Presentations In Markdown With Marp

Marp or Markdown Presentation Ecosystem is a collection of tools that allows the generation of presentations of different formats from a markdown template. The tools are written in JavaScript and have a number of options that allow presentations of different styles and formats.

This tools stood out to me as it has syntax highlighting built in and allows the creation of presentations using markdown. The presentation can also be altered using standard CSS styles.

I've spent many hours fiddling with presentations in Keynote and Google Slides, so I wanted something that would be simple to use and generate the presentation files I needed.

In this article I will look at getting Marp installed, creating a presentation and then generating presentation files.

Project Setup

Getting set up with Marp is pretty easy. Assuming you have npm installed you can initialise a project and get the marp-cli package installed in just two steps. This allows you to create one or more presentations file formats from a markdown file using the command line.

The marp-cli tool includes the marp-core package and the marpit framework, which is what is used to generate the presentations.

You should then create some directories for the input and output of files. I normally create a "dist" directory for the presentation files and a "src" directory for my markdown files. The slides file is kept in src and is called "slides.md".

The normal structure of a Marp project that I use to generate presentations is like this.

The slides markdown file is pretty simple, and consists of a front-matter section, followed by the slides themselves, formatted using standard markdown syntax. Each of the slides is separated by three dashes "---".

Front-matter

The front-matter section is a special area at the top of your slides that you can detail a few items for your presentation as a set of YAML data. This includes things like the theme to use, the option to add pagination, the header and footer to include on every page, and the size of the presentation format.

For example, to use the default format and add pagination to the slides you would add the following.

It's a good idea to add the "marp: true" directive as this helps with previewing the slides, which we'll come onto later.

The theme can be set to one of "default", "gia" or "uncover". Each theme can be given one or more class attributes to change the theme in some way. The following sets the default theme, but also adds an "invert" class to invert the colours on the theme.

Some themes also allow the addition of a "lead" class, which will centre align everything.

It's also possible to inject styles into the header section by the use of a "style" attribute. The section element is the viewport of each slide and so the following will set the background colour to light grey for every slide.

There's lots more information about themes and how to use them in the marp-core theme documentation .

The following is a typical header that I use on my Marp created presentations. This uses a centred and inverted uncover theme, with pagination, and a footer on every page with the site ident.

This template gives me the look and flexibility I need to generate slides quickly.

With the front-matter in place it's now time to look at how to generate slides. Each slide is separated from the previous slide with three slashes (---) on a single line, but after that it's pretty standard markdown.

To create a slide with a single main header element (to introduce a section) you would do something like this. 

Bullet points are creating by adding a single dash to the start of a line. The following will generate a slide with a smaller heading and two bullet points.

To create a sub bullet just indent one of the bullets by two spaces.

Marp has syntax highlighting built in, and so use that system you just surround the code with three back ticks (```). You can also stipulate the type of syntax highlighting required by including the language after the back ticks.

The following slide contains a block of PHP code, which will be rendered using the PHP syntax highlighter.

Images can also be added quite easily to your slides using the image syntax. To add a file called image.png to your slide just add it to the same directory as your markdown file and add the following to your slide.

Note that the file is loaded relative to the presentation, which means you need to point back to where the original file is located. The alternative to this is to put your files somewhere on the internet, where they will always be accessible.

The square brackets can contain meta information about the image. For example, you can use the width attribute to set the image to be a certain width on your slide and keep the aspect ratio of the image intact. In this case we are setting the image to be 900px wide.

There are a lot more meta information available for image, so it's a good idea to read through the Marp image syntax documentation page to see what's available.

Preview Slides In Visual Studio Code

Creating the slides seems quite abstract unless you can actually see the slides you create. The great thing about the Marp project is that it comes with a slide preview tool for VS Code.

This preview tool helps immensely when creating slides as it gives instant feedback on how your slides will turn out. I have found that the preview in VS Code is exactly how the slides will turn out when generated.

To install the extension, open up VS Code and search the extensions for "Marp for VS Code".

The Marp for VS code extension.

With the extension installed you can then open up your slides.md file and click the open preview side by side button to see the preview window.

You should see something like this when writing your slides.

A screenshot of VS Code, showing the Marp preview plugin.

Note! The " marp: true " directive in your front-matter section is vitally important in order to generate the previews correctly. Without this in place your markdown will be formatted as standard markdown and not as a presentation.

Once you are happy with how your slides look it's time to generate the files.

Creating The Presentation Files

With your presentation created the final step is to generate presentation files. Marp is capable of generating HTML, PDF and PPTX files, all based on your original markdown.

The HTML version is a fully featured presentation system, with the ability to break out a speaker notes window with timings and a next slide preview.

To generate a HTML presentation just run the "npx marp" command, passing in the output and input directories. If you have used local images in your presentation then you also need to add the "--allow-local-files" flag.

This will generate a file called "slides.html" in the output directory. The file name is the same name as the original markdown file.

The --allow-local-files flag is used to prevent any files from your local environment being injected into a presentation, which is a security feature. This is important if you are hosting a Marp service, but since we are creating presentations locally we know what the markup contains and where the files are.

If you want more information about why this is a security feature enabled by default see this page on local file security in Marp .

To generate a PDF of the presentation just include the --pdf flag.

And use the --pptx flag to generate a Powerpoint format file.

Note that although the powerpoint format file works, it isn't a normal presentation. Each slide is actually a screenshot of the slide, set as a background image. You can generate the file if that's a requirement of your presentation, but just be warned that you can change anything in the presentation.

We can simplify the use of the output and input directories by injecting some configuration into the package.json file. The "marp" section below informs Marp about the input and output directories and allows local files to be used within the presentation itself.

With this in place we can simplify the command by leaving out the additional flags.

Here are a few sites that might help you get started with Marp.

  • The main Marp website.
  • Marpit slide deck framework documentation . Essentially guides on how to use the markdown in slides.
  • The Marp team page on github . Contains all the code for all the of Marp suite of tools.

I'm really liking Marp. The system can take a little bit of getting used to, but it is a very powerful system that has many options available. The preview tool in VS Code really sells this system as something that I want to use to generate presentations. This is now my go to tool when creating new presentations and the results have been great.

I haven't gone into a great deal of detail with regards to generating the slides in this article, but the basic syntax is very simple (it's just markdown after all). There are also a number of directives available that can change slides, all of which are documented on the Marp documentation site .

If you are interested, I have created a Marp presentation template that I use to easily setup new presentations and generate files in different formats. This is based on a Marp template repository created by Peter Fisher , who originally told me about the Marp project. Thanks Peter!

Add new comment

Related content, lily58 r2g mechanical keyboard.

Last year I was looking through the shop at Mechboards and saw that they had a number of Lily58 R2G (ready to go) kits available. These are kits that have all of the soldering done and are pretty much complete, they just need some switches, keycaps and assembly.

That Time I Dropped The Production Database

I was reminded recently about how a GitLab engineer managed to delete the prod database , and that got me thinking about one of my biggest (production) mistakes.

RoMac Plus FauxMax Macropad Kit From Mechboards

I've been doing some research into mechanical keyboards recently and I've realised that re-built keyboards are not the only keyboards available. You can buy keyboard kits from companies that contain all the needed components for you to put together your dream keyboard.

Eight Rules Of Local Website Development Setup

A development environment is an essential part of any web development project. It allows the website to be run outside of the production environment so that features or bugs can be worked on without disruption to the live website.

Avoiding Customer Frustrations With Website Contact Forms

Having a web presence is essential for all businesses, and if the website contains a contact form then it is essential that it correctly sends contacts to that business. Contact forms are useful as it allows users to easily contact you directly through your website.

Creating Tic Tac Toe In JavaScript Part 2: Adding A Computer Player

After creating tic tac toe in JavaScript in my previous article  I decided to add a second player in the form of a computer opponent.

Instantly share code, notes, and snippets.

@johnloy

johnloy / markdown-for-slide-decks.md

  • Download ZIP
  • Star 688 You must be signed in to star a gist
  • Fork 64 You must be signed in to fork a gist
  • Embed Embed this gist in your website.
  • Share Copy sharable link for this gist.
  • Clone via HTTPS Clone using the web URL.
  • Learn more about clone URLs
  • Save johnloy/27dd124ad40e210e91c70dd1c24ac8c8 to your computer and use it in GitHub Desktop.

Electron apps

Marp: Markdown presentation ecosystem.

muryoimpl/slippr: markdown presentation app by Electron

joe-re/cafe-pitch Markdown-driven presentation tool built on Electron.

Slide deck frameworks supporting Markdown source

hakimel/reveal.js: The HTML Presentation Framework

jxnblk/mdx-deck: React MDX-based presentation decks

gnab/remark: A simple, in-browser, markdown-driven slideshow tool.

FormidableLabs/spectacle: ReactJS based Presentation Library

deckjs/deck: Deck is a markdown driven content presentation system

Hosted services

Slides.com: Online UI for creating RevealJS decks (no markdown support yet, but maybe someday )

Platon.io: Simple markdown presentations, right in the browser, using remarkjs

Swipe: Create Interactive Online Presentations On Any Device

HackMD: The best way to share knowledge in markdown

Presenta: Make slides fast!

Slidium: Beautiful and Easy Markdown Presentation - Neomobili

Deckset: Presentations from Markdown in No Time

Quiver: Developer notebook, with a presentation mode

Slideas: Slideas is the easiest way to create a beautiful Markdown Presentation, with all the features you need.

Obsidian: Obsidian is a powerful knowledge base that works on top of a local folder of plain text Markdown files.

CLI markdown ⇒ slides conversion tools

Fusuma: A tool to create slides easily for you

present: A terminal-based presentation tool with colors and effects.

backslide: CLI tool for making HTML presentations with Remark.js using Markdown

patat: (Presentations Atop The ANSI Terminal) is a small tool that allows you to show presentations using only an ANSI terminal. It does not require ncurses

markdown-slides: Using markdown, write simple but beautiful presentations with math, animations and media, which can be visualized in a web browser even without an internet connection, or exported to PDF.

S9: Write Your Slides in Plain Text w/ Markdown Formatting Conventions - Free Web Alternative to PowerPoint and Keynote

Cleaver: 30-second Slideshows for Hackers

@lee2sman

lee2sman commented Aug 16, 2020

Hi, Pandoc has 5 different ways to make slideshows with markdown! Some examples here .

Sorry, something went wrong.

@davidnunez

davidnunez commented Sep 14, 2020

This seems in the same space as Marp, perhaps? https://hiroppy.github.io/fusuma/

@dikey0ficial

dikey0ficial commented Sep 21, 2020

What about present ?

@razvn

razvn commented Oct 8, 2020

As Slidium and Slideas are the same maybe you should remove the first one which seems to no longer exists under this name.

@cogumbreiro

cogumbreiro commented Oct 14, 2020

https://github.com/sinedied/backslide

@thrgamon

thrgamon commented Nov 8, 2020

Obsidian also does this, which is rad: https://obsidian.md/

@sabitm

sabitm commented Dec 11, 2020

here's my favorite presenta

@epogrebnyak

epogrebnyak commented Dec 27, 2020

https://github.com/jaspervdj/patat

@geraldb

geraldb commented Dec 27, 2020 • edited

Slideshow (S9) is another one (disclaimer: from my humble self), see http://slideshow-s9.github.io/ . If I dare to say it's the only one that lets you use / chose template packs (e.g. s6, bespoke.js, shower.js, impress.js, reveal.js, and so on), see http://slideshow-templates.github.io/ and you can design your own template packs (they are actually just GitHub Pages / Jekyll / Liquid templates) and, thus, work by definition "out-of-the-box" on GitHub with GitHub Pages, for example. Free and open source (public domain, actually).

@dadoomer

dadoomer commented Jan 10, 2021

Markdown-slides is yet another one (sorry for the self-promotion).

Output to PDF or HTML.

Beautiful output, because it just inserts your stuff into Reveal.js.

Does not need Internet connection.

@PhilipMottershead

PhilipMottershead commented Feb 7, 2021

GitPitch is shutting down

"GitPitch is shutting down on March 1, 2021. The trial software is no longer available for download."

@fego

fego commented May 12, 2021

Found this one today : https://sli.dev/

@danielvelara

danielvelara commented Jun 10, 2021

Markdown Preview Enhanced it's a VSCode extension with a lot of Markdown features, and it comes with a Presentation mode https://shd101wyy.github.io/markdown-preview-enhanced/#/presentation

@juanbrujo

juanbrujo commented Jun 12, 2021

I've been using Cleaver for years https://github.com/jdan/cleaver

@michalradacz

michalradacz commented Jun 22, 2021

Hmmm, Slideas dies? No web, no activity ...

@debMan

debMan commented Jul 26, 2021

For CLI: https://github.com/maaslalani/slides

@acacha

acacha commented Oct 22, 2021

Awesome just what I'm looking for!

@norman-abramovitz

norman-abramovitz commented Dec 23, 2021

There is a template to make reveal.js work work with mkdocs as well.

https://github.com/dhondta/mkdocs-revealjs-template

@alenwesker

alenwesker commented Feb 18, 2022

I've tried some of the above, recommend adding https://github.com/ksky521/nodeppt to the list. It's currently my favorite markdown-to-ppt tool. It supports so many features that at least the {.build.moveIn} and the speaker mode are vital to a slide show.

Recommend everybody try that.

@gilcot

gilcot commented Mar 6, 2022 • edited

Other intersting tools to note:

  • https://github.com/googleworkspace/md2googleslides
  • https://github.com/astefanutti/decktape
  • https://github.com/maaslalani/slides
  • https://pkg.go.dev/golang.org/x/tools/present
  • https://gitpitch.github.io/gitpitch/#/
  • https://github.com/ionelmc/python-darkslide
  • https://github.com/anthonywritescode/markdown-to-presentation

@kzhk75

kzhk75 commented Mar 8, 2022

  • https://github.com/slidevjs/slidev

@N0K0

N0K0 commented Mar 16, 2022

image

ollej commented Oct 19, 2022

May I recommend the tool Rusty Slider, available as a native application for Windows/Mac/Linux as well as on the web. https://ollej.github.io/rusty-slider/

@anonymouscoolguy

anonymouscoolguy commented Oct 28, 2022

I have been working on a little side project: https://mdslides.app/

It is built using Reveal.js and Ace , and is a simple markdown presentation tool right in the browser.

@EmaSuriano

EmaSuriano commented Nov 8, 2022

Shout out to this one! Very nice DX, good documentation and fully customizable 👏

@easyjobber

easyjobber commented Nov 12, 2022 • edited

Thanks for this presentation and you are truly an inspiration 👏 https://gist.github.com/easyjobber

@haakonstorm

haakonstorm commented Dec 8, 2022

Slideas unfortunately appear defunct now. :/

@rukshn

rukshn commented Jul 22, 2023

Platon does not seem to be working anymore

@kitschpatrol

kitschpatrol commented Aug 5, 2023

iA Presenter has an opinionated take on the markdown → slides workflow.

It recently hit 1.0. Note that it's Mac only, commercial, and apparently not (yet) scriptable from the CLI.

@soaple

soaple commented Oct 7, 2023

MarkSlides is a tool that allows you to create slides using Markdown. It is created based on Marp, so any Marp syntax can be rendered to the slide. In addition, it also supports Generating Slides using AI like ChatGPT.

스크린샷 2023-10-03 오후 10 24 56

DEV Community

DEV Community

Tiiny Host

Posted on Oct 25, 2021

The Ultimate List of Markdown Presentation Tools

We have compiled a list of 23 top-notch tools to help you create slide decks with Markdown.

Marp - Marp is a creative tool for preparing beautiful slide decks or presentations. Also known as the Markdown representation ecosystem, Marp has been one of the most reliable and used tools for generating presentations with Markdown.

Slippr - Slippr is an electron-based app that’s used to create Markdown presentations. There are numerous functions available in Slippr to help you customize the most beautiful slides.

CafePitch - It is a GitHub project, and it might be a bit difficult for you to understand its usage. However, you can get a better understanding of setting up and testing the tool here.

Reveal.js - Reveal.js is one of the most innovative and simplest open-source tools out there to create Markdown presentations.

MDX Deck - MDX lets people import visual components such as charts and other designs. These can be embedded with the content in Markdown.

Remark - The remark tool has some of the best specialties available such as markdown formatting and supporting multiple languages.

Spectacle - Spectacle is a ReactJS based app. Spectacle provides customized backgrounds, animated colors, slide fragments, and many other specialties.

Deck - With Deck, you can try out multiple designs while building up your presentations.

Slides - To make your presentations visually appealing and exquisite, you can collaborate with other designers and developers with the help of slides.

Swipe - Swipe lets people prepare any presentation, be it personal or professional.

HackMD - It is a perfect tool for creating presentations in Markdown as it allows users to put ineffective ideas together and share them with others.

Presenta - Presenta provides access to several official plugins, tutorials, community guidelines, and built-in features to help the users understand the tool quickly.

Deckset - To convert your boring text documents into attractive presentations or slides, Deckset will help you out.

Quiver - Quiver is a notebook tool that is specifically designed for programmers to write their codes in Markdown.

Slideas - It provides you with both fantastic features and a quick turnaround for the presentation preparation.

Pandoc - It is a unique tool that produces presentations not only in Markdown but in HTML and JavaScript too.

Fusuma - Fusuma is another tool that is designed to help you create slides easily and quickly in Markdown.

Present - This is a GitHub project, and you can see the installation and user’s guidelines here.

Backslide - You can use Backslide to create your presentations, make slides, export them, and convert them into PDF.

Patat - This tool does not have a lot of unique features that can make it stand out from others. However, it's still a good tool to work with.

Markdown-slides - Markdown slides enable users to write their text in a unique and beautiful presentation style with several animations.

S9 - With S9, you can write your text in Markdown and format them with the help of available features.

Cleaver - If you want to generate HTML presentations using Markdown quickly and easily, then Cleaver is one of the top-notch options that you should go with.

If you'd like to know more about these tools, you can read our complete blog post here: https://tiiny.host/blog/the-ultimate-list-of-markdown-presentation-tools/

Top comments (0)

pic

Templates let you quickly answer FAQs or store snippets for re-use.

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink .

Hide child comments as well

For further actions, you may consider blocking this person and/or reporting abuse

tanujav profile image

How many followers you have on Dev.to ?🫣

Alysa - Apr 12

giovapanasiti profile image

NinjaBootstrap UI - A Pragmatic Approach To Bootstrap Reusable HTML Components

Giovanni Panasiti - Apr 12

sarveshk76 profile image

Localize Your Vue: Internationalization with Nuxt 3

Sarvesh S. Kulkarni - Mar 25

lico profile image

React Monorepo Setup Tutorial with pnpm and Vite: React project + UI, Utils

SeongKuk Han - Apr 12

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

4 Markdown-powered slide generators

Business presentation

Vector Open Stock. CC BY-SA 3.0.

Imagine you've been tapped to give a presentation. As you're preparing your talk, you think, "I should whip up a few slides."

Maybe you prefer the simplicity of plain text , or maybe you think software like LibreOffice Writer is overkill for what you need to do. Or perhaps you just want to embrace your inner geek.

It's easy to turn files formatted with Markdown into attractive presentation slides. Here are four tools that can do help you do the job.

One of the more flexible applications on this list, Landslide is a command-line application that takes files formatted with Markdown, reStructuredText , or Textile and converts them into an HTML file based on Google’s HTML5 slides template .

All you need to do is write up your slides with Markdown, crack open a terminal window, and run the command landslide followed by the name of the file. Landslide will spit out presentation.html , which you can open in any web browser. Simple, isn’t it?

Don't let that simplicity fool you. Landslide offers more than a few useful features, such as the ability to add notes and create configuration files for your slides. Why would you want to do that? According to Landslide's developer, it helps with aggregating and reusing source directories across presentations.

landslide.png

Viewing presenter notes in a Landslide presentation

Marp is a work in progress, but it shows promise. Short for "Markdown Presentation Writer," Marp is an Electron app in which you craft slides using a simple two-pane editor: Write in Markdown in the left pane and you get a preview in the right pane.

Marp supports GitHub Flavored Markdown . If you need a quick tutorial on using GitHub Flavored Markdown to write slides, check out the sample presentation . It's a bit more flexible than baseline Markdown.

While Marp comes with only two very basic themes, you can add background images to your slides, resize them, and include math. On the down side, it currently lets you export your slides only as PDF files. To be honest, I wonder why HTML export wasn’t a feature from day one.

marp.png

Editing some simple slides in Marp

You probably know pandoc as a magic wand for converting between various markup languages. What you might not know is that pandoc can take a file formatted with Markdown and create attractive HTML slides that work with the Slidy , Slideous , DZSlides , S5 , and Reveal.js presentation frameworks. If you prefer LaTeX , you can also output PDF slides using the Beamer package .

You'll need to use specific formatting for your slides, but you can add some variables to control how they behave. You can also change the look and feel of your slides, add pauses between slides, and include speaker notes.

Of course, you must have the supporting files for your preferred presentation framework installed on your computer. Pandoc spits out only the raw slide file.

pandoc.png

Viewing slides created with Pandoc and DZSlides

Hacker Slides

Hacker Slides is an application for Sandstorm and Sandstorm Oasis that mates Markdown and the Reveal.js slide framework. The slides are simple, but they can be visually striking.

Craft your slide deck in a two-pane editor in your browser—type in Markdown on the left and see it rendered on the right. When you're ready to present, you can do it from within Sandstorm or get a link that you can share with others to present remotely.

What’s that—you say that you don’t use Sandstorm or Sandstorm Oasis? No worries.There's a version of Hacker Slides that you can run on your desktop or server.

hacker-slides.png

Editing slides in Hacker Slides

Two honorable mentions

If you use Jupyter Notebooks (see community moderator Don Watkins' article ) to publish data or instructional texts, then Jupyter2slides is for you. It works with Reveal.js to convert a notebook into a nice set of HTML slides.

If you prefer your applications hosted, test-drive GitPitch . It works with GitHub, GitLab, and Bitbucket. Just push the source files for your slides to a repository on one of those services, point GitPitch to that repository, and your slides are ready to view at the GitPitch site.

Do you have a favorite Markdown-powered slide generator? Share it by leaving a comment.

That idiot Scott Nesbitt ...

Related Content

Two people chatting via a video conference app

Deckset designs your slides, so you can focus on your ideas

Write down your thoughts in your favourite text editor, and deckset will turn them into beautiful presentations..

Requires macOS High Sierra (10.13) or newer.

Loved by teams and individuals around the world

Deckset on iOS

Now Available

Deckset for iOS

Download on the App Store

Requires iOS/iPadOS 16.0 or newer.

Deckset Newsletter

Subscribe to our newsletter to receive latest news about Deckset

Markdown slides editor

Create your next presentation with Markdown

MdSlides - App cover image

Goal Oriented

Unlike many other presentation editors, MdSlides is designed to focus on the content rather than moving text blocks back and forth.

Mobile First

The device used does not affect the process of creating presentations, nor the final result.

Installable

Even though it is a web application, it can be used offline or even installed ( see PWAs ).

Creating presentations in MdSlides is declarative in nature. It requires no extra interaction other than writing down one's thoughts.

Processing data is not stored in the application, but in the one's device/browser only.

Open Source

The application development is community-driven. Contributions are welcome on GitHub .

presentations from markdown

Appears last

Appears first

Appears second

presentations from markdown

IMAGES

  1. Creating professional slides from Markdown notes

    presentations from markdown

  2. How to create html presentations with markdown files

    presentations from markdown

  3. Marp creates PDF presentations from Markdown

    presentations from markdown

  4. Markdown Presentations in linux environments

    presentations from markdown

  5. Make PowerPoint Presentations with R Markdown

    presentations from markdown

  6. Create R Markdown reports and presentations even better with these 3

    presentations from markdown

VIDEO

  1. Как вставить видео в презентацию PowerPoint

  2. How to Create Presentations with Markdown for Devs

  3. 30 идей для текстовых презентаций в PowerPoint

  4. Live Reload in Sublime Text with Markdown Preview

  5. Ballroom C Sunday Mar. 17

  6. Machine Learning: NOVICE TO PRO -- Final Presentations Day (DAY#40) #machinelearning #python

COMMENTS

  1. What? Slides? From Markdown?

    This piece is part of a series of posts about things you can do with Markdown. It's true! You can make a slide presentation from Markdown, and not just a dancing bear. There is a growing number of tools to do just that. I tested a few ways to build slide presentations using Pandoc and one standalone HTML presentation format called Remark.

  2. Marp: Markdown Presentation Ecosystem

    Marpit (independented from Marp) is the framework that transforms Markdown and CSS themes to slide decks composed of HTML/CSS. It is optimized to output only the minimum set of assets required. Find all of the Marp tools, integrations, and examples in the GitHub repository! Marp (also known as the Markdown Presentation Ecosystem) provides an ...

  3. How to create professional slides from Markdown notes

    Most presentations include images, and Marp extends Markdown to define their size. Add an image to your slides and change the size with width and height options.![w:32 h:32](image.jpg) You can also apply filters to images, such as adding opacity, a shadow, or even rotating the image. Here you have all the available predefined CSS filters ...

  4. Creating Presentations In Markdown With Marp

    Marp or Markdown Presentation Ecosystem is a collection of tools that allows the generation of presentations of different formats from a markdown template. The tools are written in JavaScript and have a number of options that allow presentations of different styles and formats. This tools stood out to me as it has syntax highlighting built in and allows the creation of presentations using ...

  5. Creating Slides with Marp: Custom Themes and Automation with ...

    Benefits of Creating Slides with Marp Focus on Content. With tools like PowerPoint, adjusting layouts can be time-consuming. Marp automatically outputs slides from a Markdown file, allowing you to ...

  6. The Ultimate List of Markdown Presentation Tools

    However, there are a couple of excellent tools out there that are explicitly used for creating presentations with Markdown. Marp, Slippr, and Cafe-Pitch are the most used tools for Markdown Presentations. All three are GitHub Projects. Top Markdown Presentation Tools. Watch on.

  7. List of markdown presentation tools · GitHub

    CLI markdown ⇒ slides conversion tools. Pandoc. Fusuma: A tool to create slides easily for you. present: A terminal-based presentation tool with colors and effects. backslide: CLI tool for making HTML presentations with Remark.js using Markdown. patat: (Presentations Atop The ANSI Terminal) is a small tool that allows you to show ...

  8. The Ultimate List of Markdown Presentation Tools

    Marp - Marp is a creative tool for preparing beautiful slide decks or presentations. Also known as the Markdown representation ecosystem, Marp has been one of the most reliable and used tools for generating presentations with Markdown. Slippr - Slippr is an electron-based app that's used to create Markdown presentations.

  9. Create Presentations with Markdown

    Marp is an open-source presentation framework that allows you to create beautiful, customizable slide decks using the simplicity and flexibility of Markdown. By harnessing the power of Markdown ...

  10. 4 Markdown-powered slide generators

    Marp. Marp is a work in progress, but it shows promise. Short for "Markdown Presentation Writer," Marp is an Electron app in which you craft slides using a simple two-pane editor: Write in Markdown in the left pane and you get a preview in the right pane.. Marp supports GitHub Flavored Markdown.If you need a quick tutorial on using GitHub Flavored Markdown to write slides, check out the sample ...

  11. Slidev 101: Coding presentations with Markdown

    Taking note of the contents of the slides.md file:. This markdown file consists of a YAML Frontmatter configuration that allows you to customize specific slides or the deck as a whole, and is denoted with opening and closing ---characters.. Each title on the Markdown file will use a # Title heading 1 notation to indicate the slide's title and main heading.

  12. Deckset for Mac: Presentations from Markdown in No Time

    Write down your thoughts in your favourite text editor, and Deckset will turn them into beautiful presentations. Try Deckset for free See our pricing. Requires macOS High Sierra (10.13) or newer. Loved by teams and individuals around the world.

  13. Beautiful presentations from markdown

    Additional css — can easily be added to the bottom of the markdown file in a style section if you want something easily changed for the presentation you are currently working on. I could certainly see benefit to having your own css if you have a load of cool effects you want to use regularly. <style>. #bright {. color: deeppink;

  14. Home / MdSlides

    Markdown slides editor. Create your next presentation with Markdown. Goal Oriented . Unlike many other presentation editors, MdSlides is designed to focus on the content rather than moving text blocks back and forth. Mobile First . The device used does not affect the process of creating presentations, nor the final result.

  15. How to Create a Slideshow Presentation From Markdown Notes

    The kramdown program only translates the markdown given to valid HTML.It doesn't try to create a full page of properly formatted HTML with a header and body sections. This is important for creating a slide show from markdown.For each slide, the HTML for the given content will be generated and not anything extra. It is easy to wrap the slides inside the main HTML for the slide show page.

  16. Beautiful Slides in Markdown With Slidev

    Slidev is a presentation tool for engineers. You can generate beautiful slides from documents written in Markdown. Slidev uses Windi CSS ( Tailwind CSS compatible) and allows you to specify a Grid…

  17. Markdown / Text to presentation slides

    Create interactive presentation slides. from. Markdown. Just provide your Markdown here and click "Convert". You can also drop your Markdown file (*.md or *.txt) into the textarea: Become mega supporter for the future of presentations and get the following features on top (more will be added constantly):

  18. MARP

    Do you find PowerPoint annoying? Try MARP - a free VSCode extension for making presentations in Markdown. The video will show you how to create slides, add i...

  19. Markdown Slides

    A short introduction into how to set up Markdown Slides and what you can do with it.

  20. Slides

    To stop the presentation, press `Escape` or click the cross in the upper-right corner of the presentation. You can use any valid Markdown file as a presentation. To separate slides, enter `---` at the start of a line surrounded by newlines. ```md # Presentations using Slides A demo on how to build presentations using Slides.

  21. VSCode Tutorial: Create slide deck presentation with Markdown ...

    In this Visual Studio Code Tutorial, We'll learn about how to create a presentation (PDF, PPT) with Markdown on Visual Studio Code (VSCode) editor with Live ...

  22. Bye-bye PowerPoint. Hello Marp!. Could this free Markdown-based tool

    Good. Proceed with the boilerplate. You'll have to specify you're using Marp, because the Markdown document can't know it by default:---marp: true---Let's also add an H1 tag below, just so there's something to see on the screen: # Slide 1 Title. You can now click on the Preview icon to see your presentation:

  23. Using Typora to turn your Markdown into beautiful presentations

    All you have to do is open Typora's settings. There you go to the 'Export' section and add a new export option that we call 'RevealJS'. Choose the 'Pandoc' template for the new ...