# 3d-touch-canvas

**Repository Path**: kvinwang/3d-touch-canvas

## Basic Information

- **Project Name**: 3d-touch-canvas
- **Description**: 3D Touch Canvas, for iPhone 6S, 6S Plus and iPad Pro
- **Primary Language**: HTML
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2018-01-22
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

3D Touch Canvas
===

This is a demo for 3D Touch on Mobile Safari on iPhone 6S, 6S Plus and iPad Pro. It's a simple line drawing app which you can use the force of the finger to control the width of the drawn line.

Mobile Safari on iOS 9 for iPhone 6S, 6S Plus and iPad Pro introduces [3D Touch for web developers](http://www.mobilexweb.com/blog/ios9-safari-for-web-developers). The line drawing code is heavily inspired by (or copied from) @kangax's 2013 article: [Exploring canvas drawing techniques](http://perfectionkills.com/exploring-canvas-drawing-techniques/).

Demo URL: https://cheeaun.github.io/3d-touch-canvas/

Here's how it looks like, with a sketch:

<img src="screenshot.png" width="375" height="667" alt="Screenshot">

And here's a nice demo video: https://twitter.com/cheeaun/status/656631323923091456

And here's how it looks like on iPad Pro:
https://twitter.com/firt/status/666414635390795776
https://twitter.com/firt/status/666438652860506112

Instructions
---

- Touch anywhere to start drawing lines (except the top link).
- Two-finger tap to clear canvas.