Skip to main content
AppsJavaScriptResourcesVR & AR

Browser Snapchat Clone

By November 29, 2019No Comments
Not sure why I never updated my blog with that but last summer I coded a browser based SnapChat clone. Oh! so much fun. It’s been coded by using JavaScript and a face tracking library called tracking.js NOTE: for whatever reason the code doesn’t work for you is mostly like (95%) because of a cross browser compatibility issue. I’ve tested this on IE, Chrome and Safari. I’ve used the inbuilt cam to display the user’s face on the screen, and then used tracking.js to track the co-ordinates on-top of which a vector image (PNG) of the filter should be placed. A major issue was NOT the AR aspect of it using tracking.js BUT rather cross browser compatibility. That was a major pain point. Here’s the code for it which is on codepen, has to be tested across different browsers though

See the Pen Snapcat Snapchat by Kauress (@Kauress) on CodePen.

Here is another codepen:

See the Pen Web Snapchat clone <3 by Kauress (@Kauress) on CodePen.

Leave a Reply