georgewpark / 3D-Paper-Shredder

This project combines the power of 3D CSS, background-clip, and a touch of JS to create a functional 3D paper shredder. Type to edit the text on the paper then press the green button to shred your text.

Home Page:https://cdpn.io/QWrxPyJ

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

3D Paper Shredder

This project combines the power of 3D CSS, background-clip, and a touch of JS to create a functional 3D paper shredder. Type to edit the text on the paper then press the green button to shred your text.

3D Paper Shredder Demo

Live Demo

A live demo is available on CodePen and Netlify.

License

This project is licensed under the MIT License - see the license.md file for details.

Project Setup

From the root directory, install project dependencies by running npm install from the terminal.

Build the files and start the local dev server by running npm run dev from the terminal. This should open the dev site automatically at http://localhost:3000/.

You can build the files without starting the dev server by running npm run build from the terminal to compile the development build or npm run prod to compile the production build.

About

This project combines the power of 3D CSS, background-clip, and a touch of JS to create a functional 3D paper shredder. Type to edit the text on the paper then press the green button to shred your text.

https://cdpn.io/QWrxPyJ

License:MIT License


Languages

Language:SCSS 54.5%Language:JavaScript 32.3%Language:HTML 13.2%