API demo: discover your device information

API demo: discover your device information

To discover device information of your device we created a tool. The snippet above showes your device properties. This demo is based on a few lines of Javascript code. Based on the characteristics the API finds your corresponding device. The following steps are performed to discover this information:

  1. Important properties of the device are collected. For example: the screen size or CPU information.
  2. This API combines these data and finds the corresponding device. For example: iPhone XS or Samsung Galaxy S9.
  3. The device information is accessible in a JavaScript variable. For example: deviceAPI.deviceName.

The snippet above displays key information. However, there are more device properties available. More specifically, the following information is available:

  • Browser name
  • Browser version
  • OS name
  • OS code name
  • The type of device
  • Device brand
  • Device name
  • Screen height
  • Screen width
  • Pixel density / Screen Ratio
  • GPU
  • The version of the OS
  • Touchscreen capabilities

In this tutorial I explain how to implement the device detection API in Javascript!

Use-case of the device detection API

A simple use-case is personalising page content. For example, an iPhone user is sent to a specific page. Alternatively, a Samsung user sees a Samsung designed page. Before the page is loaded the device detection API is accessed. Subsequently, the type of device is identified. A simple if-else javascript code routes the user to the matching page. The image below shows how this could look like.

Device discovering and page personalisation for iPhone and Samsung.

Currently, users need to browse website to find the matching product. However, when using the device detection API this process is history. This saves a lot of time. Moreover, the user experience improves dramatically. Imagine not having to search for your product anymore! 😀


The device detection API is a JavaScript tool to discover device information. The API needs just one line of JS code to work. However, to implement some more logic on my website I often use GTM. Therefore I wrote a tutorial for the device detection API for GTM. Check it here!

Please leave a comment if the information is (in)correct! Because we love feedback 🙂


5 Responses

  1. Aunamie Villamor says:

    hi, please update me on how to update my javascript.Pls will you?

  2. Duy says:

    Just want to say: Great work! This is very helpful!

  3. Jean-Claude Masse says:

    Didn't get an answer. But it's seem that if this is not on mobile, this will not show anything. Is it normal?

    • admin says:


      The API detects mobile device like phones and tablets. For Desktop it won't be able to identify the actual model but the algorithms tries to find the most specific information e.g. Macintosh.

Leave a Reply

Your email address will not be published. Required fields are marked *