How to View a Website’s HTML: Page Source vs Inspect Element

Use View Page Source to read the HTML a website sends to your browser, or Inspect to examine the page as it exists after scripts have changed it. On Windows, Ctrl + U opens source in common desktop browsers. Right-clicking an element and choosing Inspect opens the developer view.

view the HTML code of any website in any browser

Page source and Inspect are different

Tool What you see Useful for
View Page Source The document’s source HTML. Finding a title, meta description, link or markup sent by the site.
Inspect / Elements / Inspector The live document structure, called the DOM, and related styles. Finding which element creates something you can see on screen.
Network and Sources tools Resources and requests loaded by the browser. Checking scripts, images or a page that adds content later.

A page built with JavaScript can show content that is missing from its initial source. That does not mean the browser is broken. Inspect the live page or its loaded resources instead.

Open source in Chrome, Edge, Firefox or Opera

On a desktop, right-click a normal part of the page and look for View page source or Page source. In common Windows browsers, try Ctrl + U. Chrome documents that shortcut in its keyboard reference; on a Mac, Chrome uses Command + Option + U.

If a website intercepts right-clicks, use the browser’s menu or source shortcut. Shortcuts can differ on other systems and keyboards. On a phone, the browser may not offer the same source-view tools as its desktop version.

Inspect the element you are looking at

  1. Open the webpage and find a heading, button or picture you want to understand.
  2. Right-click it and choose Inspect.
  3. Look at the selected entry in the Elements or Inspector panel.
  4. Expand nearby elements to see how the section is arranged.
  5. Check the styles beside it to see which rules control its appearance.

Chrome’s Inspect mode guide explains the selector tool. Edge also documents opening DevTools through right-click → Inspect. Firefox provides its own developer-tool shortcuts.

F12 or Ctrl + Shift + I can open developer tools in common Windows desktop browsers, depending on the browser settings and keyboard. The panel can be docked in different places; it is not always on the right in Chrome or at the bottom in Firefox.

Find a simple piece of HTML

In source view, use the Find command to search for <title>, description, or a word from the page. In the live inspector, use the selector to jump to the visible element rather than guessing its position in a long document.

Changes made in the inspector normally affect your local view and can disappear after a reload. They do not publish changes to the website or show a different page to other visitors.

What source view cannot reveal

It does not reveal private server-side code, databases or files the server did not send. It also does not grant access to a protected account or make someone else’s images and code free to reuse.

If your aim is to change browser behaviour rather than inspect a page, see browser cache controls or website shortcuts.

Frequently asked questions

What is the difference between source and Inspect?

Source shows the HTML document sent to the browser. Inspect shows the live document after scripts may have changed it.

How do I open source on Windows?

Try Ctrl + U in a common desktop browser, or use View page source from the browser’s available menu.

Can Inspect change the website for everyone?

Ordinary inspector edits affect your local view. They do not publish a change to the server.

Can I see a site’s private database or PHP code?

No. Browser source tools only show content and resources delivered to the browser.