# Troubleshooting Pixelay
# Loading production URLs
By default, any live/production URLs (eg. google.com) are unlikely to load properly in the Pixelay web app.
To use Pixelay with staging/production URLs, please install the Pixelay Chrome Plugin (opens new window), which will run in the background and allow loading live URLs that aren't from your local development environment.
# Thin white line around image exports
Occassionally some images will contain a faint, thin white line around the edges. Figma does this (opens new window) if a layer isn't positioned on a rounded pixel value (eg. Y: 156.76 or X: 56.3) will automatically result in this sub-pixel line getting included in the export. To resolve the issue, please ensure that your layer positions are all rounded pixel values.
# HTTPS vs HTTP Pixelay URLs
Whenever you create a Pixelay comparison URL, the plugin will automatically generate two different URLs: an SSL
https:// URL and a non-SSL
If you're comparing a live/production website, you'll need to ensure your own website URLs are
https:// and also use the Pixelay
https:// URL to compare them.
If you're comparing a
localhost development environment URL, you'll need to ensure your own local website URLs are
http:// and also use the Pixelay
http:// URL to compare them.
# Websites using "vh" CSS units
If your website CSS uses "vh" units for any elements, please note that these may appear much taller than they normally would at a resonable browser height due to Pixelay setting the viewport height to be the same as your full Figma mockup.
# Create a brand new URL for your Figma file
Due to it being a fairly sensitive feature, instead of adding a button/icon to click, we've made this feature activate only by entering the "Konami Code" on your keyboard while the plugin is running:
Up, Up, Down, Down, Left, Right, Left, Right, B, A
Typing that sequence of keys on your keyboard will trigger the Pixelay plugin to create a brand new URL for your Figma file, so you could enter it in a duplicated Figma file to give it a different brand new URL than the original one.
# Pixelated image exports
If you're uploading your designs while the image assets in Figma are still progressively loading, they may be exported looking pixelated, as the image wasn't fully loaded in the Figma file before it was exported. To resolve this, please ensure that all of the images have loaded 100% and are looking sharp inside the Figma file before uploading your images with the Pixelay plugin.
To help further with solving this issue, you can use the "Downsizer" feature (opens new window) to shrink down your image fills to match their layer size, which will shrink their file size and ensure they load much faster in your Figma file.
# Designs not uploading from the plugin, or images not loading in the web app
One reason this might be happening is if your ISP (internet service provider) is blocking the QUIC protocol. You can confirm this by opening up your developer console in the browser or in Figma and see the error message
There are a couple of workarounds for this issue:
- Switching to your mobile phone's Wi-Fi hotspot/tether for you computer's internet connection
- Disabling QUIC (opens new window) in your browser
# VPN may be required in China
Please note, if you're in China, the accounts server may be blocked by "The Great Firewall of China". If you're seeing a activation error, despite using a valid key, you will likely need to use a VPN (opens new window) to resolve the issue.