We are pleased to announce the release of new Readium Web packages, and an update to the Playground to demonstrate their new features. This update brings custom fonts to the reader, and a new Injection API to inject custom CSS and JS into the Navigator.

Browse the full releases on Github

Custom Fonts

You can test the new fonts in the Readium Playground. Pick a reflowable publication and head to the Display settings. You will find our default list of curated fonts for Latin scripts:

• Literata
• Atkinson Hyperlegible Next
• Luciole
• Old Style Serif (system)
• Modern Serif (system)
• Sans Serif (system)
• Humanist Sans serif (system)
• Monospace (system)
• iA Writer Duospace
• Open Dyslexic
• Accessible DfA

We tried to include a wide range of fonts to cover different needs and preferences. In combination with our spacing presets, we hope to provide a comfortable and accessible reading experience for all users.

For implementers, the list of fonts is entirely customizable through preferences. The application supports static and variable fonts, collections specific to languages and scripts. You can use local fonts, and providers Google Fonts and Bunny Fonts are built-in. Give their embed code to the preferences using our helpers, and the application will take care of the rest.

In an upcoming release, we will leverage variable fonts to provide more accessible options such as adapting their weights on a per-font basis.

Injection API

Custom Fonts would not have been possible without the new Injection API.

This API allows you to inject custom CSS and JS into the Navigator. It is a simple yet powerful API that opens up a lot of possibilities, and custom fonts are only one use case among many.

We are already using it to inject Readium CSS and functionality scripts into the Navigator. But it was primarily designed to accept your own styles and scripts, as well as the ones from a list of allowed domains.

This API offers greater flexibility and customization options for implementers, allowing them to pick the resources in which they want to prepend or append their link and script elements. Once again, they don't have to worry about the rest, everything is taken care of for them.

Technical updates and breaking changes

• No breaking changes are expected in these releases.
• Thorium Web package provides some fonts that you have to copy and expose e.g. public folder in NextJS. If you don’t they will not work, their path should be fonts/**/*.
• An issue with system fonts for Fixed-Layout EPUBs on Android has also been fixed using this new API.
• Shared package accessibility locales have been migrated to the thorium-locales repository.

All these new packages are available on npm:

• @readium/navigator
• @readium/navigator-html-injectables
• @readium/shared
• @edrlab/thorium-web