This is an alternative site for discovering Elm packages. You may be looking for the official Elm package site instead.
1.0.0 1.0.1
A simple way to turn your Elm code into a presentation.
version 1.1.0
license BSD3
native-modules False
elm-version 0.16.0 <= v < 0.17.0
Tag 1.1.0
Committed At 2015-11-29 11:25:18 UTC
elm-lang/core 3.0.0 <= v < 4.0.0 3.0.0
Apanatshka/elm-signal-extra 5.7.0 <= v < 6.0.0 5.7.0




A simple way to turn your Elm code into a presentation.


Presentation editors have lots of great features to play around with. But they are usually limited in how they let you present things interactively. Enter Elm. Elm makes it fun to program interactive web pages.


A President slide is simply a Signal Element. Make your presentation by putting the slides into a list and calling President.present. This is a working presentation:

import Signal exposing (Signal,constant)
import Text exposing (..)
import Time
import Graphics.Element exposing (Element, centered)
import Graphics.Collage exposing (..)
import President

animation t = 
  collage 800 800 [
    fromString "Animations!" |> typeface ["Comic Sans MS"] 
    |> height 120 |> centered |> toForm |> rotate (sin (t/250) * 0.2)

slides: List (Signal Element)
slides = [
  constant <| centered <| height 120 
    <| fromString "Use left/right arrow keys to navigate", animation (Time.every (60*Time.millisecond)),
  constant <| centered <| height 120 
    <| fromString "Use up/down arrow keys to go to beginning/end"

main = President.present slides


This thing is just about as simple as it gets. There should probably be some more options for slide navigation, positioning, etc. Perhaps transitions if you want to get fancy.


Elm still has plenty of issues, some of which break President slides in particular. Presentations can break under following conditions:

  • scaled Elements followed by collages
  • fittedImage elements followed by regular image
  • other weird things.