# impress/impress.js

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/impress-impress-js).**

38,583 stars · 6,619 forks · JavaScript · mit

## Links

- GitHub: https://github.com/impress/impress.js
- Homepage: http://impress.js.org
- awesome-repositories: https://awesome-repositories.com/repository/impress-impress-js.md

## Description

Impress.js is a browser-based presentation engine that transforms standard document elements into interactive, three-dimensional slide decks. It functions as a declarative layout framework, allowing users to define spatial relationships and visual perspectives for content within a coordinate-based canvas. By leveraging the browser's native rendering capabilities, it enables the creation of non-linear slide decks that utilize hardware-accelerated transformations for movement and perspective shifts.

The framework distinguishes itself through a state-driven controller that manages active content segments and applies dynamic styling hooks based on element visibility. It provides programmatic control over navigation, layout scaling, and visual state management, allowing for complex transitions triggered by keyboard or touch inputs. This architecture supports the development of immersive visual narratives and high-fidelity interface prototypes that rely on spatial positioning rather than traditional linear slide progression.

The system includes tools for configuring presentation dimensions, transition speeds, and viewport scaling to ensure consistent output across different display environments. It also maintains state persistence through browser URL fragments, enabling deep linking and history navigation within the presentation.

## Tags

### Content Management & Publishing

- [DOM-Based Presentation Engines](https://awesome-repositories.com/f/content-management-publishing/dom-based-presentation-engines.md) — Transforms standard document elements into interactive, three-dimensional slide decks using CSS transformations.
- [Web-Based Presentation Tools](https://awesome-repositories.com/f/content-management-publishing/web-based-presentation-tools.md) — Creates interactive, non-linear slide decks that run directly in a web browser.
- [Presentation Frameworks](https://awesome-repositories.com/f/content-management-publishing/presentation-frameworks.md) — Builds specialized slide-based applications that require programmatic control over navigation and layout.
- [Interactive Storytelling Tools](https://awesome-repositories.com/f/content-management-publishing/interactive-storytelling-tools.md) — Builds immersive visual narratives where spatial movement and perspective shifts guide the audience.

### User Interface & Experience

- [Declarative Layout Frameworks](https://awesome-repositories.com/f/user-interface-experience/declarative-layout-frameworks.md) — Provides a structural approach to defining spatial relationships and visual perspectives for content elements.
- [State-Driven UI Controllers](https://awesome-repositories.com/f/user-interface-experience/state-driven-ui-controllers.md) — Tracks active content segments and applies dynamic styling hooks to elements based on their visibility.
- [Presentation Flow Control](https://awesome-repositories.com/f/user-interface-experience/presentation-flow-control.md) — Controls slide transitions programmatically using a command interface that manages manual step movement. ([source](http://impress.js.org/DOCUMENTATION.md#reference-api))
- [Navigation Controllers](https://awesome-repositories.com/f/user-interface-experience/navigation-controllers.md) — Manages slide transitions by listening for keyboard and touch inputs to update the global coordinate state.
- [Presentation Layout Configuration](https://awesome-repositories.com/f/user-interface-experience/presentation-layout-configuration.md) — Defines screen dimensions, transition speeds, and scaling behavior for all presentation steps. ([source](http://impress.js.org/DOCUMENTATION.md#reference-api))
- [Spatial Layout Engines](https://awesome-repositories.com/f/user-interface-experience/spatial-layout-engines.md) — Uses hardware-accelerated matrix transformations to place and orient elements within a three-dimensional coordinate space.