Written by Ramon Gebben

Pressure (GitHub: yamartino/pressure, License: MIT, npm: pressure)

Pressure is a library which makes dealing with Apple’s “Force Touch” and “3D Touch” simpler. At the time of writing this update the support for Force Touch was:

  • iPhone 6s
  • iPhone 6s Plus
  • MacBook 2015
    • 13” MacBook Pro 2015
    • 15” MacBook Pro 2015
  • Magic Trackpad 2

And sadly it only works inside Safari. The developer has let us know that when there are more devices or browsers to support, that it will also be supported by Pressure.

Future devices and browser that support force will be added when they come out

The library is constructed in a way that Force Touch for new Macs and 3D Touch for the new iPhone 6s and 6s Plus are all bundled under one roof with a simple API. By example:

var Pressure = require('pressure');

Pressure.set('#myAwesomeElement', {
    change: (force) => {
        this.innerHTML = force;

What this will do is render the “amount” of pressure put on #myAwesomeElement. The rest of the API is just as straight forward. Use end to know when the user has stopped putting pressure on your awesome element. startDeepPress to know if the user is applying deep pressure and endDeepPress to know when it stopped. And as a curtesy there is unsupported which tell’s you if Force Touch is available.

If you want to know more head over to the Github Page and check the documentation. The developer also implemented a very nice demo on that same page.

Since it’s the first day of the week I would like to remind you to challenge yourself this week. This weeks challenge is to create a workshop about a topic you care about or want to research. The only way you can be sure of knowing something is when you can teach it to somebody else.

Head over to the Workshopper Challenge section for more details.