To learn how to view website code, open the page’s source rather than relying on its visible layout. On a desktop browser, the fastest options are the page’s context menu, a keyboard shortcut, or a view-source: URL.

When you see source code, you are reading the HTML delivered by the server for that page request. This view helps you find text, metadata, linked CSS, and JavaScript references, but it is different from the live page structure shown in developer tools.

How to view website code in a desktop browser: menus, shortcuts, and view-source

1. Use the page menu: Right-click an empty area of the webpage and select View Page Source, View Source, or a similarly named option. Chrome, Edge, and Firefox generally provide this context-menu command on ordinary webpages.
2. Use a keyboard shortcut: On Windows or Linux, press Ctrl+U in Chrome, Edge, or Firefox. On macOS, the shortcut varies by browser; Chrome and Firefox commonly use Option+Command+U or Command+U. If one shortcut does not work, use the context menu or address-bar method.
3. Use the browser menu: Safari users can enable the Develop menu in Safari’s settings, then choose Develop > Show Page Source. Other browsers may place a source command under a page or developer menu, although a direct menu item is not available in every version.
4. Use a view-source URL: Copy the page address, open a new tab, and add view-source: before the complete address. For example, enter view-source:https://example.com/page in the address bar, then press Enter. This method is useful when the context-menu command is hidden or disabled.

The browser opens the HTML in a new tab, often with line numbers and basic formatting. The source tab is read-only from the website’s perspective. You can save or copy the displayed text for analysis, but changing a local copy does not change the page on the server.

How to see source code on a phone or tablet

Mobile browsers do not consistently include a View Source command in their menus. The most portable method is to type view-source: followed by the page URL in the address bar. For example, use view-source:https://example.com. Chromium-based mobile browsers and some Firefox versions may open the returned HTML this way.

If the browser treats the address as a search instead of a source request, try these steps:

• Load the webpage normally, copy its complete URL, and paste it into a new tab.
• Add view-source: without a space before https:// or http://.
• Try the browser’s long-press page menu for a source option, if one is available.

Safari on iPhone and iPad does not provide a consistent built-in page-source viewer. For detailed inspection, open the page on a desktop browser or use remote web-inspection tools connected to a Mac. A mobile view may also omit tools available in desktop browsers, so the desktop method is usually more reliable for technical checks.

How to check source code for text, CSS, and JavaScript

Once the source tab is open, press Ctrl+F on Windows or Linux, or Command+F on macOS, to search the HTML. Search for a distinctive word from the page, the title, a heading, an ID, a class name, or a section of a URL.

To check source code for visible content, search for the exact text as it appears on the page. If the search finds nothing, the text may be added after the initial HTML loads, inserted only after an interaction, or supplied inside an embedded component. Differences in punctuation, capitalization, and encoded characters can also prevent an exact match.

Look for these common references when identifying linked files:

• CSS: Search for stylesheet or .css. A typical reference looks like <link rel=”stylesheet” href=”styles.css”>. The source shows the file’s address, not necessarily the CSS rules inside that file.
• JavaScript: Search for <script, src=, or .js. An external file may appear as <script src=”app.js”></script>. JavaScript can also appear directly between script tags.
• Metadata and structure: Search for <title>, meta, canonical, h1, or body to locate page information and major HTML sections.

Relative links such as app.js or /assets/site.css are resolved against the page’s domain and path. A source viewer may let you open a linked file by selecting its URL, but that opens a separate resource rather than displaying it as part of the HTML document.

How to look at website code versus the live DOM

Page source shows the HTML delivered in the initial response. The live DOM, visible in a browser’s developer tools under Elements or Inspector, shows the document after the browser has parsed it and scripts have run.

That distinction explains why the two views may not match. JavaScript can add a product list, replace a message, insert navigation, change attributes, or remove an element after the page loads. A framework can also build much of the visible page from a small initial HTML shell. In those cases, the content appears in the live DOM but not in the original source.

Use page source when you need to inspect the server-delivered HTML, initial metadata, or links included in the response. Use the live DOM when you need to inspect the current structure after scripts, user actions, or browser updates have changed it.

Developer tools also let you edit the live DOM or CSS temporarily for testing. Those edits affect only your local browser session; they do not modify the website’s original server source. To identify what changed after load, compare the page-source tab with the current Elements view, and use the Network panel when you need to inspect the actual HTML response or files requested by the browser.