Use the Banner Dimensions tool to accurately measure the pixel dimensions of web elements and distances between elements.

Latest Version

Version
1.0.1
Update
June 5, 2024
Size
339KiB
Developer
Category
Users
393
Rating
5 ★
Manifest Version
3
Web Store Status
Languages Support
Bahasa Indonesia
Bahasa Melayu
Deutsch
English
Filipino
Français
Kiswahili
Nederlands
Norsk
Tiếng Việt
Türkçe
Català
Dansk
Eesti
Español
Español (Latinoamérica)
Hrvatski
Italiano
Latviešu
Lietuvių
Magyar
Polski
Português (Brasil)
Português (Portugal)
Română
Slovenský
Slovenščina
Suomi
Svenska
čeština
Ελληνικά
Српски
български
русский
українська
עברית
فارسی‎
मराठी
हिन्दी
বাংলা
ગુજરાતી
தமிழ்
తెలుగు
ಕನ್ನಡ
മലയാളം
ไทย
አማርኛ
‫العربية
中文 (简体)
中文 (繁體)
日本語
한국어
See more
Permissions
ActiveTab
Scripting
See more

Banner Dimensions Extension

Banner Dimensions is your go-to Chrome extension for mastering the art of visual content. Whether you're a social media manager, a designer, or a business owner, understanding the proper sizing of elements for different platforms is critical.
The concept of dimension meaning can often be confusing, especially when each platform has its own set of rules and specifications. Our extension takes the guesswork out of the equation by offering clear sizing recommendations for popular platforms like Twitter, YouTube, Facebook, LinkedIn, and more.

❤️ Popular Banner Sizes on Social Media:
1️⃣ Twitter Banner Dimensions:
Twitter banners serve as digital billboards for your profile. Optimal size: 1500 x 500 pixels. Ensure your brand message fits within this space.
2️⃣ Twitter Image Dimensions:
Images in tweets play a significant role. Optimal size: 1024 x 512 pixels. Engage your followers with captivating visuals.
3️⃣ LinkedIn Banner:
LinkedIn emphasizes professionalism. Banner size: 1584 x 396 pixels. Impress potential clients and employers with a polished header.
4️⃣ LinkedIn Header:
LinkedIn headers act as virtual business cards. Size: 1584 x 396 pixels. Showcase your expertise and industry focus.
5️⃣ Facebook Banner Dimensions:
Facebook cover photos create the first impression. Size: 820 x 312 pixels. Highlight your business or personal brand effectively.
6️⃣ Facebook Ad Dimensions:
Advertisements require precision. Recommended size: 1200 x 628 pixels. Capture attention with compelling visuals.
7️⃣ Facebook Event Cover Photo:
Planning an event? Event cover photo size: 1920 x 1080 pixels. Generate excitement among attendees.
8️⃣ Facebook Image Dimensions:
Regular posts also deserve attention. Recommended size: 1200 x 630 pixels. Share your stories effectively.

🧩 Platform-specific Dimensions:
YouTube Banner Dimensions:
Your YouTube channel art sets the tone for your content. Ideal size: 2560 x 1440 pixels. Utilize this canvas effectively to showcase your brand identity.
YouTube Thumbnail Dimensions:
Thumbnails significantly impact click-through rates. Optimal size: 1280 x 720 pixels. Create enticing visuals to encourage viewer engagement.
Twitch Banner Dimensions:
Attention, gamers and streamers! Twitch banner size: 1920 x 480 pixels. Set the stage for your channel effectively.

➡️ Other Dimensions:
- Favicon Dimensions:
The tiny icon next to your website's URL holds importance. Favicon size: 16 x 16 pixels. Keep it simple yet recognizable.
- Etsy Banner Dimensions:
Etsy sellers, take note. Banner size: 1200 x 300 pixels. Attract shoppers with a well-designed storefront.

Our extension is the ultimate tool for streamlining your visual content creation process and ensuring that your images shine on every platform. Bid farewell to guesswork and welcome a seamless design experience with our Google Chrome extension. Elevate your online presence today!
This tool calculates the distance from your mouse pointer vertically and horizontally until it reaches a boundary. It is perfect for measuring distances between elements on a web page. However, it may not be as effective for measuring images due to significant color variations between pixels.

1. Images & HTML Elements o Measure distances between various elements like images, input fields, buttons, videos, gifs, text, and icons. This tool enables you to measure anything visible in the browser.
2. Mockups o If your designer provides mockups in PNG or JPEG format, simply drag them into Chrome, enable Dimensions, and start measuring.
3. Keyboard Shortcut o Use the ALT + D shortcut to initiate and terminate dimension measurements.
4. Area Boundaries o Need to determine the radius of a circle or measure the dimensions of a specific area obscured by text? Press Alt to measure the dimensions of the enclosed region.

⌨️ Key Features:
❗ Measure distances between images, input fields, buttons, videos, gifs, text, and icons with precision.
❗ Ideal for web professionals needing to determine thumbnail size YouTube, LinkedIn banner size, Facebook banner size, and more.
❗ Easily calculate the size of YouTube banner or the size for LinkedIn banner to ensure perfect alignment.

Versatile Usage: From analyzing Twitter banner size to determining the YouTube banner size, \"Dimensions\" caters to a broad audience with diverse needs. Whether you're working on social media graphics or website layouts, this extension simplifies the measurement process.
Intuitive Interface: The user-friendly interface of \"Dimensions\" guarantees a seamless experience for users of all levels. Simply activate the tool and hover over elements to visualize distances accurately.
Efficiency at Your Fingertips: With a convenient keyboard shortcut (ALT + D), you can initiate and stop measurements swiftly, enhancing your workflow efficiency.
Mockup Compatibility: If you receive mockups in PNG or JPEG format, \"Dimensions\" enables you to effortlessly measure elements by dragging and dropping them into Chrome.
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "name": "Banner Dimensions", "description": "Use the Banner Dimensions tool to accurately measure the pixel dimensions of web elements and distances between elements.", "version": "1.0.1", "manifest_version": 3, "author": "Terry Lawson", "default_locale": "en", "icons": { "16": "images/icon16.png", "32": "images/[email protected]", "48": "images/icon48.png", "128": "images/icon128.png" }, "commands": { "_execute_action": { "suggested_key": { "default": "Alt+D" } } }, "background": { "service_worker": "service-worker.js", "type": "module" }, "content_scripts": [ { "js": [ "chrome.js", "patch-worker.js"], "matches": [ "" ] } ], "action": { "default_icon": { "16": "images/icon16.png", "19": "images/icon19.png", "32": "images/[email protected]", "38": "images/[email protected]" }, "default_title": "Banner Dimensions", "default_popup": "popup.html" }, "web_accessible_resources": [ { "resources": ["dimensions.js"], "matches": ["http://*/*", "https://*/*" ] } ], "host_permissions": ["http://*/*", "https://*/*"], "permissions": [ "activeTab", "scripting" ]}
Read more

Similar Extensions

icon

Image Size Check Extension · Developer Tools 393 7 ★ 6.51KiB

icon

Metric Spy Extension · Developer Tools 393 2 ★ 268KiB

icon

Pixel measurement Extension · Developer Tools 393 26 ★ 236KiB

icon

Image Dimensions Extension · Developer Tools 393 1 ★ 46.66KiB

icon

Digital Ruler Extension · Productivity 393 5 ★ 155KiB

icon

Measuremate Extension · Developer Tools 393 42 ★ 797KiB

icon

Dimensions Extension · Photos 393 0 ★ 140KiB

icon

Image Dimensions Detector Extension · Productivity 393 0 ★ 11.6KiB

icon

Width and Height Finder Extension · Developer Tools 393 0 ★ 41.82KiB

icon

Image Size Extension · Developer Tools 393 4 ★ 152KiB

icon

Dimensions Extension · Developer Tools 393 454 ★ 17.28KiB

icon

Image Aspect Ratio Resize Calculator Extension · Productivity 393 0 ★ 88.89KiB

icon

Image Size Checker Extension · Developer Tools 393 0 ★ 143KiB

icon

Screen Ruler - Measure The Web Extension · Developer Tools 393 26 ★ 1.97MiB

icon

Dimensions Extension · Productivity 393 2 ★ 153KiB

icon

Measure Pixel Extension · Developer Tools 393 0 ★ 27.4KiB

icon

What Font - font finder Extension · Productivity 393 249 ★ 161KiB

icon

Measure Everything Extension · Developer Tools 393 40 ★ 52.93KiB

icon

Element Size Measurement Extension · Developer Tools 393 5 ★ 29.65KiB

icon

Page Ruler Extension · Productivity 393 4 ★ 171KiB

icon

Page Ruler: Your Web Design Companion Extension · Developer Tools 393 0 ★ 46.28KiB

icon

Image Color Picker Extension · Productivity 393 3 ★ 465KiB

icon

Designer Tools Extension · Developer Tools 393 227 ★ 987KiB

icon

Dimensions Inspect | Gridman Extension · Developer Tools 393 87 ★ 816KiB