Get a free trial // Grow your CSS skills // Land your dream job

#104: Quick Tip: Use Dropbox to Make a Public URL for Anything

Just save the website from the browser (in Firefox, you get an .html file and all the resources), drop it in your Public folder, and use the right-click contextual menu to grab the public URL.


  1. Andrew Turner
    Permalink to comment#

    This technique also comes in really handy for creating simple Facebook Page Tabs as it’s got SSL and will render the HTML, CSS and Images as you’ve coded it.

  2. Dan
    Permalink to comment#

    Why didn’t the header image show?

  3. Mike Kennedy
    Permalink to comment#

    I’ve been doing this for a couple months now :)

  4. Kestrel Blackmore
    Permalink to comment#

    Awesome idea :) Dropbox rocks man!

  5. Ahmad Awais
    Permalink to comment#

    Awesome man ! It was nice !
    SSL is really a thing to be considered in it !

  6. Tori
    Permalink to comment#

    I luf Dropbox.

  7. Patrycjusz Różański
    Permalink to comment#

    Nice idea of Dropbox but for me better work’s FTP and some as a subdomain :D

    If my friends will use it i’ll us it to :D simple :D

  8. BrianC
    Permalink to comment#

    Been using this for a while now, it is really awesome – there is also a plug-in for it called Screen Grabber, that saves screen dumps of either the entire screen or just the active window, and directly saves it as a .jpg in your dropbox public folder for easy sharing.

    One of the more awesome things about it is that you can share folders with your friends that use it – very good for collaborative working, and it syncs instantly.

  9. Philip Arthur Moore
    Permalink to comment#

    If you’re using WordPress I suggest checking out the Share a Draft plugin, especially if you have clients or friends who will not be bothered with the above technique.

  10. Michael
    Permalink to comment#

    Dropbox = 2GB free acct.
    SugarSync= 5GB free acct.

    Please use my referral link and get an additional 500mb

    BTW with SugarSync there is NO limit on the amount if free space you can get when using “referrals”

  11. Armando Duran
    Permalink to comment#

    Very cool … thanks for the tip!

  12. AK
    Permalink to comment#

    You know what.. On the free account, we just can save file to the public link (include all people who don’t have dropbox acc) only JPG files.

    I used to save not only the JPG, but also my other files into it, by changing the extension to JPG (include zip, rar, and others, what ever you want).

    That would be the real quick tip trick.. :)

  13. hoss9009
    Permalink to comment#

    Video is dead :(

  14. Jeff Rubow
    Permalink to comment#

    Does anyone else notice that the entry in this video was apparently posted 1930 years ago?
    How does that happen anyway?

    @Dan I might be a bit late to this conversation, but no one else answered your question so I’ll go ahead. The firefox save as “Web Page, Complete” feature grabs all files that are referenced directly by that html document, for example jpgs, css files, etc.. It does not grab files that are referenced by other referenced files. If the header image is defined by a css background-image: rule in a linked css document, the css document will be downloaded, but the image will not be.

    I ran into this issue when I had to do some css work for a site that was being developed by someone else. I didn’t have access to the original development files, just the live site. I had to go into the css document and download each image individually to my own test environment.

    The folks over at Firefox should change the name of the save dialog from “Web Page, Complete” to “Web Page, …Mostly Complete”. Or even better, they should fix the save functionality.

    (Google Chrome now has the same feature with the same deficiency )

  15. Roy J
    Permalink to comment#

    Great little trick, thanks!!

  16. Sean W
    Permalink to comment#

    Sadly DropBox is getting rid of public folders (for new users) so this technique will soon be unavailable for those who don’t already have a dropbox account (they should though).
    – “We wanted to let our developers know about an upcoming change to the Public folder for all user accounts. In April, we launched the ability to share any file or folder in your Dropbox with a simple link. This new sharing mechanism is a more generalized, scalable way to support many of the same use cases as the Public folder.

    After July 31, we will no longer create Public folders in any new Dropbox accounts. If your app depends on Public folders, we recommend switching to the /shares API call. Public folders in existing accounts, however, will continue to function as before.”

    Just thought I’d let you all know if you already didn’t.

  17. farcalled
    Permalink to comment#

    SugarSync says 10 gb max extra for referals rather than unlimited.

  18. Anne
    Permalink to comment#


    Late to this post. However, I want to thank you for this excellent video! I needed a way to test localhost files for mobile testing on phone emulators .. so of course, I needed a public url …just tested this with dropbox/ – works great!
    Beats SDK downloads/uploads to a remote server!

  19. Kurnia1
    Permalink to comment#

    Yes, i think is cool trick, for some time it help like @sean say Dropbox public folder is no longer available, but some account still work, i do still use it for creating my newsletter just use your outlook or thunderbird->save as html->save Dropbox public folder->goto mailchimp and import from URL(your public folder URL). By the way there a new site called so we can save url to dropbox (let say download a zip file) have a try!

Leave a Comment

Posting Code

We highly encourage you to post problematic HTML/CSS/JavaScript over on CodePen and include the link in your post. It's much easier to see, understand, and help with when you do that.

Markdown is supported, so you can write inline code like `<div>this</div>` or multiline blocks of code in in triple backtick fences like this:

  function example() {
    element.innerHTML = "<div>code</div>";

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed