Skip to content
Stephan edited this page Jan 16, 2015 · 68 revisions

Themes, extensions & tools available to work with your deck.js presentations.

Visual Themes

The deck.js package has the following visual styles included: Swiss, Neon, and web 2.0. These are visible in the demo.

Have a visual theme you want to share? Make a GitHub repo and share it here.

Transition Themes

The deck.js package has the following transition styles included: Fade, Vertical Slide, and Horizontal Slide. These are visible in the demo.

Extensions

  • deck.js-codemirror by iros: Integrates codemirror into deck.js, giving you editable, executable, syntax highlighted code snippets right inside your slides.

  • deck.remote.js by seppo0010: Uses node.js to give speakers a remote view to control slides, have a stopwatch, keep notes, and preview next slide.

  • deckjs-remote by chrisjaure: Control your deck remotely through a node.js service. Presenters can use the publicly available service or host it themselves.

  • deck.gotonumkey.js by KingHenne: A small extension that lets you jump to any slide by pressing the corresponding number key(s).

  • CoderDeck by cykod: A deck.js extension and packaging script that uses CoderMirror2 to create interactive live-coding presentations for the web. Sample Deck.

  • deck.events.js by mikeharris100 (Original Gist by imakewebthings, inspired by teddziuba): A simple extension to trigger events when a slide becomes the current, previous or next slide.

  • deck.js-markdown by tmbrggmn: A deck.js extension that adds support for Markdown syntax in slide contents.

  • deck.ext.js by barraq provides:

    • A set of extensions:
      • Deck.toc.js provides a support for managing and displaying TOC information,
      • Deck.asvg.js allows to include animated SVG based schema to the slides,
      • Deck.clone.js allows to clone any Deck presentation (the master) into any other popup windows (the clones). Cloned deck windows will follow the same navigation as the master. This extension is useful when used with the Deck.notes.js which allows to toggle speaker notes view: the master deck will display the slides while the cloned deck will display the speaker notes.
      • Deck.notes.js allows to toggle speaker notes view. Notes are added per slide using a simple div with the "notes" class.
    • themes:
      • A beamer like theme
    • and use cases for Deck.js
  • deck.js Extensions by twitwi. Descriptions, demos and download bundle on his home page. Provides new extensions:

    • deck.includedeck: boilerplate-free presentation files (include this extension only and select a profile)
    • deck.progress.js: improved status extension, allow for fancy progress indicators
    • deck.fit.js: maintain slide size despite changes in viewport size
    • deck.svg.js: robustly load SVG with options (CSS friendly, etc)
    • deck.anim.js: easy way to animate your slides and svg images
    • deck.step.js: use up and down keys to navigate past sub-slides to the next main slide
    • deck.smartsyntax.js: neat way to create slides (going beyond markdown)
    • deck.simplemath.js: latex equations in slides
    • deck.clone.js: clone the display to another browser window, to have a presenter view
    • deck.timekeeper.js: show a timer (presenter view) and records timing (for rehearsal and debriefing)
    • deck.metadata.js: reuse HTML title and metadata within your slides (e.g., title page, footer)
    • deck.attribution.js: easily attribute the sources of your images
    • deck.container-styling.js: easily change the style of the deck container (allow for hiding the status)
  • deck.console-notes.js by mikeharris100: A very simple extension for logging presenter notes to the console.

  • deck.pointer.js by mikeharris100: An extension to display a "laser" pointer (just a small trail of red dots which follows the mouse).

  • deck.presenterview.js by stvnwrgs : A super easy to use presentation view, with notes and the next slide.

  • deck.blank.js by mikek70: A simple extension to blank/unblank the current slide by pressing 'b', to draw the attention back to the presenter

  • deck.blank.js by knittl: Allows to show black or white shims at the press of a button, which users are familiar with from other popular presentation software.

  • deck.search.js by markahon: A search extension: Simple text search from slides or search by slide number.

  • deck.automatic.js by rchampourlier: A deck.js extension that enables playing the slides automatically.

  • deck.scroll.js by carpeliam: Adds the ability to navigate through slides by means of scrolling the page.

  • deck.zoom.js by grayside: Go to the first slide with "Home", the last slide with "End", mark a slide with "b", and return to it with "r".

  • deck.annotate.js by nemec: Allow live annotation of slides using multiple shapes, colors, and sizes.

  • deck.lazyload.js by nemec: Load deck.js slides lazily using ajax. Consequently, lets slides be separated into individual .html files.

  • deckjs-iframes by groovecoder: Deferred and dynamic loading of iframe elements to optimize decks with iframes

  • deck.split.js by houqp: Split long slides into multiple small slides with the same title.

  • deck.onepage.js by cyberCode: Display slideshow as a single page, with slides separated by a horizontal rule.

  • deck.narrator.js by klamping: Adds the ability to have an audio narration track to your slides. More details in the blog post about it.

  • deck-jade by epower: a deck.js boilerplate slide set with a bower install file for dependencies.

  • deck-js-panorama by braandl: a deck.js extension to easily create a panoramic background.

Tools

  • deckem by DamonOehlman: Jade templating for deck.js.
  • markdown2deckjs by ulf: Write your slides in Markdown and convert them into a full working deck.
  • deck.js Slide Show (S9) Pack: Write your slides in Markdown or Textile and use the Slide Show (S9) Ruby gem to generate your deck.
  • deckpad by calvinmetcalf: write your slides in what ever language you want and deploy them with docpad.
  • asciidoc-deckjs by houqp: Write your slides in Asciidoc with extra support for code highlighting.
  • deck.rb: Write slides in Markdown and see your slideshow at http://localhost:4333. Supports relative images, multiple files, and showoff-style slide break directives.
  • remote-impress: Remote Impress.js and Deck.js presentation controller. Allows to use phone for switching slides.
  • keydown: Another Ruby gem to write slides in Markdown (Slidedown- and Showoff-style) and generate a single-file HTML presentation. Has solid defaults, uses Codemirror and allows for custom CSS, JS, and any deck.js themes.
  • Slidify: An R package to create, customize and publish reproducible HTML5 slides from markdown. Slidify supports multiple slide frameworks including deck.js, shower, google-io2012, html5slides, showoff etc.
  • Jekyll & deck.js: Jekyll skeleton for creating presentations with deck.js. Long feature list includes modern tooling, asset pipeline, remote control, MathJax, and more.

Platforms based on deck.js

  • SlideWiki: A platform to create online presentations collaboratively.
Clone this wiki locally