Need help with WebSlides?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

5.8K Stars 565 Forks MIT License 560 Commits 61 Opened issues


Create HTML presentations in seconds —

Services available


Need anything else?

Contributors list

WebSlides = Create stories with Karma

MIT License Release codecov Donate Twitter

Finally, everything you need to make HTML presentations, landings, and longforms in a beautiful way. Just a basic knowledge of HTML and CSS is required. Designers, marketers, and journalists can now focus on the content. —


Simply choose a demo and customize it in seconds. Latest version:

What's in the download?

The download includes demos and images (devices and logos). All content is for demo purposes only. Images are property of their respective owners.

├── index.html
├── css/
│   ├── base.css
│   └── colors.css
│   └── svg-icons.css (optional)
├── js/
│   ├── webslides.js
│   └── svg-icons.js (optional)
└── demos/
└── images/


  • Navigation (horizontal and vertical sliding): remote presenters, touchpad, keyboard shortcuts, and swipe.
  • Slide counter.
  • Permalinks: go to a specific slide.
  • Autoslide.
  • Click to nav.
  • Simple CSS alignments. Put content wherever you want (vertical centering...)
  • 40+ components: background images/videos, quotes, cards, covers...
  • Flexible blocks with auto-fill and equal height.
  • Fonts: Roboto, Maitree (Serif), and San Francisco.
  • Vertical rhythm (use multiples of 8).


  • Code is clean and scalable. It uses intuitive markup with popular naming conventions. There's no need to overuse classes or nesting.
  • Each parent
    in the
    element is an individual slide.

Slide 1

Slide 2

Vertical Sliding

CSS Syntax (classes)

  • Typography:
  • Background Colors:
  • Background Images:
  • Cards:
  • Flexible Blocks:


You can add:

Dive In!


We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.