Canada - Full Height

Informations:

Screentest.app is an online tool for web developers. It operates on screens with a width larger than 1024px.
The recommended screen resolution for the best experience is 1920x1080 (Full HD).
Please revisit this website from your computer!

Short Introduction: YouTube (1:08 min.)

Loading...

Width: 320 px

Mobile: 2.55%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 320 px

Mobile: 2.55%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 360 px

Mobile: 6.95%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 360 px

Mobile: 6.95%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 375 px

Mobile: 16.82%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 375 px

Mobile: 16.82%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 384 px

Mobile: 3.02%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 384 px

Mobile: 3.02%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 390 px

Mobile: 15.74%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 390 px

Mobile: 15.74%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 393 px

Mobile: 6.75%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 393 px

Mobile: 6.75%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 412 px

Mobile: 6.57%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 412 px

Mobile: 6.57%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 414 px

Mobile: 8.83%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 414 px

Mobile: 8.83%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 428 px

Mobile: 4.63%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 428 px

Mobile: 4.63%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 430 px

Mobile: 5.91%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Fix width

Width: 430 px

Mobile: 5.91%

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: /

Scale: 1

Width: 576 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: SM*

Fix width

Width: 576 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: /

Bootstrap: SM*

Scale: 1

Width: 601 px

Mobile: %

Tablet: 3.98%

Desktop: %

Tailwind: /

Bootstrap: SM

Fix width

Width: 601 px

Mobile: %

Tablet: 3.98%

Desktop: %

Tailwind: /

Bootstrap: SM

Scale: 1

Width: 640 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: SM*

Bootstrap: SM

Fix width

Width: 640 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: SM*

Bootstrap: SM

Scale: 1

Width: 744 px

Mobile: %

Tablet: 4.16%

Desktop: %

Tailwind: SM

Bootstrap: SM

Fix width

Width: 744 px

Mobile: %

Tablet: 4.16%

Desktop: %

Tailwind: SM

Bootstrap: SM

Scale: 1

Width: 768 px

Mobile: %

Tablet: 26.93%

Desktop: 2.66%

Tailwind: MD*

Bootstrap: MD*

Fix width

Width: 768 px

Mobile: %

Tablet: 26.93%

Desktop: 2.66%

Tailwind: MD*

Bootstrap: MD*

Scale: 1

Width: 800 px

Mobile: %

Tablet: 5.75%

Desktop: 3.19%

Tailwind: MD

Bootstrap: MD

Fix width

Width: 800 px

Mobile: %

Tablet: 5.75%

Desktop: 3.19%

Tailwind: MD

Bootstrap: MD

Scale: 1

Width: 810 px

Mobile: %

Tablet: 15.7%

Desktop: 3.62%

Tailwind: MD

Bootstrap: MD

Fix width

Width: 810 px

Mobile: %

Tablet: 15.7%

Desktop: 3.62%

Tailwind: MD

Bootstrap: MD

Scale: 1

Width: 820 px

Mobile: %

Tablet: 8.15%

Desktop: 2.02%

Tailwind: MD

Bootstrap: MD

Fix width

Width: 820 px

Mobile: %

Tablet: 8.15%

Desktop: 2.02%

Tailwind: MD

Bootstrap: MD

Scale: 1

Width: 834 px

Mobile: %

Tablet: 5.94%

Desktop: %

Tailwind: MD

Bootstrap: MD

Fix width

Width: 834 px

Mobile: %

Tablet: 5.94%

Desktop: %

Tailwind: MD

Bootstrap: MD

Scale: 1

Width: 960 px

Mobile: %

Tablet: 1.15%

Desktop: %

Tailwind: MD

Bootstrap: MD

Fix width

Width: 960 px

Mobile: %

Tablet: 1.15%

Desktop: %

Tailwind: MD

Bootstrap: MD

Scale: 1

Width: 962 px

Mobile: %

Tablet: 1.45%

Desktop: %

Tailwind: MD

Bootstrap: MD

Fix width

Width: 962 px

Mobile: %

Tablet: 1.45%

Desktop: %

Tailwind: MD

Bootstrap: MD

Scale: 1

Width: 992 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: MD

Bootstrap: LG*

Fix width

Width: 992 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: MD

Bootstrap: LG*

Scale: 1

Width: 1024 px

Mobile: %

Tablet: 4.52%

Desktop: 1.41%

Tailwind: LG*

Bootstrap: LG

Fix width

Width: 1024 px

Mobile: %

Tablet: 4.52%

Desktop: 1.41%

Tailwind: LG*

Bootstrap: LG

Scale: 1

Width: 1200 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: LG

Bootstrap: XL*

Fix width

Width: 1200 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: LG

Bootstrap: XL*

Scale: 1

Width: 1280 px

Mobile: %

Tablet: 4.58%

Desktop: 7.71%

Tailwind: XL*

Bootstrap: XL

Fix width

Width: 1280 px

Mobile: %

Tablet: 4.58%

Desktop: 7.71%

Tailwind: XL*

Bootstrap: XL

Scale: 1

Width: 1334 px

Mobile: %

Tablet: 1.87%

Desktop: %

Tailwind: XL

Bootstrap: XL

Fix width

Width: 1334 px

Mobile: %

Tablet: 1.87%

Desktop: %

Tailwind: XL

Bootstrap: XL

Scale: 1

Width: 1366 px

Mobile: %

Tablet: %

Desktop: 9.67%

Tailwind: XL

Bootstrap: XL

Fix width

Width: 1366 px

Mobile: %

Tablet: %

Desktop: 9.67%

Tailwind: XL

Bootstrap: XL

Scale: 1

Width: 1400 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: XL

Bootstrap: XXL*

Fix width

Width: 1400 px

Mobile: %

Tablet: %

Desktop: %

Tailwind: XL

Bootstrap: XXL*

Scale: 1

Width: 1440 px

Mobile: %

Tablet: %

Desktop: 5.78%

Tailwind: XL

Bootstrap: XXL

Fix width

Width: 1440 px

Mobile: %

Tablet: %

Desktop: 5.78%

Tailwind: XL

Bootstrap: XXL

Scale: 1

Width: 1470 px

Mobile: %

Tablet: %

Desktop: 1.1%

Tailwind: XL

Bootstrap: XXL

Fix width

Width: 1470 px

Mobile: %

Tablet: %

Desktop: 1.1%

Tailwind: XL

Bootstrap: XXL

Scale: 1

Width: 1536 px

Mobile: %

Tablet: %

Desktop: 10.8%

Tailwind: 2XL*

Bootstrap: XXL

Fix width

Width: 1536 px

Mobile: %

Tablet: %

Desktop: 10.8%

Tailwind: 2XL*

Bootstrap: XXL

Scale: 1

Width: 1600 px

Mobile: %

Tablet: %

Desktop: 2.29%

Tailwind: 2XL

Bootstrap: XXL

Fix width

Width: 1600 px

Mobile: %

Tablet: %

Desktop: 2.29%

Tailwind: 2XL

Bootstrap: XXL

Scale: 1

Width: 1680 px

Mobile: %

Tablet: %

Desktop: 1.5%

Tailwind: 2XL

Bootstrap: XXL

Fix width

Width: 1680 px

Mobile: %

Tablet: %

Desktop: 1.5%

Tailwind: 2XL

Bootstrap: XXL

Scale: 1

Width: 1920 px

Mobile: %

Tablet: %

Desktop: 24.15%

Tailwind: 2XL

Bootstrap: XXL

Fix width

Width: 1920 px

Mobile: %

Tablet: %

Desktop: 24.15%

Tailwind: 2XL

Bootstrap: XXL

Scale: 1

Width: 2560 px

Mobile: %

Tablet: %

Desktop: 3.12%

Tailwind: 2XL

Bootstrap: XXL

Fix width

Width: 2560 px

Mobile: %

Tablet: %

Desktop: 3.12%

Tailwind: 2XL

Bootstrap: XXL

Scale: 1

Nav

Copy link Link copied!

Standard
View

Full Height
View

: Data for July - September 2024.

Data provided by Statcounter Global Stats

Width:

Mobile

Tablet

Desktop

Tailwind

Bootstrap

320 px
360 px
375 px
384 px
390 px
393 px
412 px
414 px
428 px
430 px
576 px
601 px
640 px
744 px
768 px
800 px
810 px
820 px

Width:

Mobile

Tablet

Desktop

Tailwind

Bootstrap

834 px
960 px
962 px
992 px
1024 px
1200 px
1280 px
1334 px
1366 px
1400 px
1440 px
1470 px
1536 px
1600 px
1680 px
1920 px
2560 px

Dark

SWITCH

SWITCH

background color

border color

Light

Off On

Auto-Slide: seconds

Off On

Remove loading="lazy"

Off On

Apply "Fix width" to all screens

Are you sure you want to reset all settings to their default values?

Info:

Screentest.app is an online tool for web developers, which is used to test a website’s responsive design.
It is based on the popularity of screen resolutions, with data provided by Statcounter Global Stats.
By default, the site shows ‘Worldwide’ data for the most popular screen resolutions across all platforms (Mobile, Tablet, Desktop). However, you can add or remove specific screen resolutions by clicking the ‘Visible/Hidden’ buttons. The site offers various customizations, and all changes will be saved in your ‘Local Storage’. When choosing which screen resolutions should be ‘Visible’, data and a graph are provided below, showing the sum (∑) of screen width popularity.

Address:

Please enter your localhost address (beginning with http://) or your IP address, then click ‘Load’.
You can also enter the URL of a website, provided it’s not protected by the ‘Same-origin policy’.
Please ensure to include https:// at the beginning of the URL (websites that start only with http:// will not load).

Copy link:

You can copy the link if you wish to view your website in a different browser. If your website is already live and not protected by the ‘Same-origin policy’, you can share this link with your co-workers or clients.

Countries:

By default, the system loads worldwide data for screen popularity. However, if you’re developing a website for a specific country, simply click on a link from the list to load data for that particular country.

All data is sourced from
Statcounter Global Stats.

Colors:

Based on the design of the website you’re working on, you can switch between the ‘Dark’ and ‘Light’ themes. You also have the option to change the background color, border color, and the background color for the status & navigation bar (Mobile & Tablet). All changes will be saved in your Local Storage.

Lazy-load:

"Lazy-loading of iframe elements defers offscreen iframes from being loaded until the user scrolls near them. This saves data, speeds up the loading of other parts of the page, and reduces memory usage."

Source:
web.dev/articles/iframe-lazy-loading

Border-Radius:

The ‘Border-Radius’ option allows you to remove the rounded corners of screens, giving them a more block-like, squared-off appearance. Please note that this change will only affect the appearance on mobile and tablet screens.

Status & Navigation Bar:

The ‘Remove Status & Navigation Bar (Mobile & Tablet)’ option allows you to hide the status and navigation bars on all mobile and tablet screens. This might be useful if you’re developing an app.

Scale:

By default, the ‘Scale’ is set to 1. This means that for screens larger than your browser’s innerHeight, a ‘Scroll’ option is available. However, you can remove the ‘Scroll’ and use the ‘Scale’ option instead. This will adjust the device’s height (and width) to fit within your browser’s innerHeight. Please note, using the ‘Scale’ option may cause the website to appear slightly blurry.

Fix width:

If your website (or just the index page) doesn’t require vertical scrolling because the content fills the entire screen height, you can apply the ‘Fix Width’ option to all screens, or only to those that are problematic.
This option is not necessary for the Firefox browser.

Auto-slider:

Use Auto-slider for easy viewing of visible screens. Adjust the interval by entering your preferred number of seconds.
For the best experience, consider activating ‘Remove loading=“lazy”’ when using Auto-Slider.

ALL PLATFORMS

MOBILE

TABLET

DESKTOP

Data for July - September 2024.

Data for July - September 2024.

Data for July - September 2024.

Data for July - September 2024.

© 2024 M3Web. All Rights Reserved.