How to Copy Code From a Website

A web page's source code.
  Evgenii_Bobrov / Getty Images

If you're a web user (or maybe even an aspiring web designer or developer) who often comes across great looking websites with features or aspects that make you wonder how they were created, you may want to consider viewing the website code or copying it and saving it for later so that you can look at it again to figure out how it was done. And, perhaps even replicate it in your own web design or development projects.

Copying the code from a single web page is extremely easy when you're familiar with the web browser that you're using. Here's how to do it for three of the most popular web browsers.

Copying in Google Chrome

  1. Open up Chrome and navigate to the web page that you want to copy.
  2. Right-click on a blank space or empty area on the web page. Just make sure you don't right click on a link, an image, or any other feature. 
  3. You'll know you'll have clicked in a blank space or empty area if you see an option labeled View Page Source in the menu that appears. Select View Page Source to show the web page's code.
  4. Copy the entire code by highlighting all or just the specific area of code that you want, pressing Ctrl+C or Command+C on your keyboard and then paste the code into a text or document file.

Copying in Mozilla Firefox

  1. Open up Firefox and navigate to the web page that you want to copy.
  2. From the top menu, select Tools > Web Developer > Page Source.
  3. A new tab will open with the page's code, which you can copy by highlighting a specific area or by right-clicking to Select All if you want all of the code. Press Ctrl+C or Command+C on your keyboard and paste it into a text or document file.

Copying in Apple's OS X Safari

  1. Open up Safari and navigate to the web page that you want to copy.
  2. Click on Safari in the top menu and then click Preferences.
  3. In the top menu of the box that pops up over your browser, click the Advanced gear icon.
  4. Make sure Show Develop menu in menu bar is checked off.
  5. Close the Preferences box and click the Develop option in the top menu.
  6. Click Show Page Source to bring up a tab with the code from the bottom of the page.
  7. Use your mouse to drag the tab up your screen if you'd like to bring it up to view it in full and copy it by highlighting all or just the specific area of code that you want, pressing Ctrl+C or Command+C on your keyboard and then Paste it wherever you want.

Updated by: Elise Moreau