Skip to content
Get packs

Guide · Open source

How to use AR.js: setup, prerequisites and what to know first

Updated · written with AI from the project's own documentation and checked against our catalogue data

AR.js is a free, MIT-licensed JavaScript library for adding augmented reality to web pages, so virtual objects appear over a phone or laptop camera view. This guide explains what the library is for, what you need before starting, how to get the code, and where to find the maintained version. It is written for developers and teams who already know basic HTML and JavaScript.

AR.jsjeromeetienne/AR.js · ★ 15.8k · MIT

Quick start

  1. 1Confirm the prerequisites. Make sure you have a browser with camera access and basic HTML and JavaScript knowledge.
  2. 2Pick the right repository. Check the README notice and decide whether to use the maintained AR-js-org repository or this archived copy.
  3. 3Clone the repository. Run git clone https://github.com/jeromeetienne/AR.js in a terminal to get the code.
  4. 4Choose your AR type. Decide whether you need marker-based or location-based AR, as described in the README.
  5. 5Pair with a 3D tool. Combine AR.js with A-Frame or Three.js, the web 3D tools it is typically used with.
  6. 6Test on a real device. Open your page in a browser with camera access and check that the virtual objects appear over the camera view.

What AR.js does

AR.js is a lightweight library for augmented reality on the web. The README says it supports marker-based AR and location-based AR.

It is typically used together with web 3D tools such as A-Frame and Three.js, which are listed as topics of the project.

  • Marker-based AR: virtual content is anchored to a marker the camera recognises.
  • Location-based AR: virtual content is placed relative to a geographic location.
  • Runs in the browser, so no native app is needed.

What you need before you start

The project lists two prerequisites: a web browser with camera access, and basic knowledge of HTML and JavaScript. AR.js is a code library, not a ready-made app, so you will be writing a web page yourself.

  • A web browser with camera access
  • Basic knowledge of HTML and JavaScript

Get the AR.js code

The README's install instruction is to clone the repository with git. Run the command below in a terminal, then open the project files and follow the examples in the repository.

Read the README and the LICENSE.txt file in the project for details on use and licensing.

git clone https://github.com/jeromeetienne/AR.js

Check whether you need the maintained version

The README states that this repository has moved to a new GitHub organization and will no longer be updated. It says the old repository will stay up so existing links and CDNs keep working, but it will not receive new changes.

The README says the maintained version is at https://github.com/AR-js-org/AR.js, and that image tracking is available only on that new repository. If you need active maintenance or image tracking, start from the new repository instead of this one.

  • Use the AR-js-org repository for the actively maintained version.
  • Use this repository only if you are working with the existing code or need a fixed reference.

Choose a comparable project if AR.js does not fit

The analysis lists A-Frame, Three.js and MindAR as comparable projects. A-Frame and Three.js are the 3D tools AR.js is usually paired with. MindAR is a different option to compare when you are choosing an approach for image-based AR.

  • A-Frame: a web framework for building 3D scenes, often used with AR.js.
  • Three.js: a 3D library for the web, often used with AR.js.
  • MindAR: a comparable project to evaluate for AR on the web.

What people use it for

  • Adding a simple AR experience to a company or product web page
  • Building marker-based AR demos that run without installing an app
  • Prototyping location-based AR features inside a web page
  • Adding AR to a site that already uses A-Frame or Three.js

Frequently asked questions

Is AR.js free to use?

Yes. The README describes AR.js as free and open source, and the repository is listed under the MIT licence. Check the LICENSE.txt file in the project for the full terms.

How do I install AR.js?

The README's install command is git clone https://github.com/jeromeetienne/AR.js. Note that this repository will no longer be updated, so the README points to the AR-js-org repository for the maintained version.

Is AR.js still maintained?

The README says this repository will not be updated anymore and that the maintained version lives at github.com/AR-js-org/AR.js. Open issues and pull requests on the new repository.

What do I need to run AR.js?

You need a web browser with camera access and basic knowledge of HTML and JavaScript. AR.js is a code library, so you build the web page yourself.

Does AR.js support image tracking?

The README says image tracking is on the new AR-js-org repository, not on this one. Use that repository if you need it.

What are alternatives to AR.js?

The analysis lists A-Frame, Three.js and MindAR as comparable projects. A-Frame and Three.js are commonly used alongside AR.js, while MindAR is a separate option to compare.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

AR.js suits developers who want simple marker-based or location-based AR inside a web page, especially if they already use A-Frame or Three.js. Because this repository will no longer be updated, most new projects should start from the maintained AR-js-org repository, and people who want a ready-made app rather than a code library should look elsewhere.

Install options & downloads