A fork is a complete copy of a Pen or Project that you can save to your own account and modify. Your forked copy comes with everything the original author wrote, including all of the code and any dependencies.

How to Fork

To fork a Pen or Project, click the Fork button at the lower right in the footer of the Editor view.

You can create a fork before making changes, or you can start editing first, then fork when you’re ready to save your changes.

A link to the parent is included in the description of a forked Pen or Project (shown in Details View).

The original tags are also included on your fork. You can change or remove them in your settings.

Hot tip! If you’re forking your own work often, consider making a Pen Template or Project Template instead.

Forks in “Your Work”

The “All” view of your Pens and Projects in Your Work includes forks. But, you can choose to exclude them, or you can choose to show only your forked Pens.

To exclude forks, select “All My Pens (No Forks)” or “All My Projects (No Forks”) from the “View” menu. To see only forks select “Fork” from the view menu.

Forks on Your Profile

We separate your forks from your original Pens and Projects on your profile pages so visitors to your profile will see your work first.

On your profile, forked Pens are categorized under Pens > Forked. Forked Projects are categorized under Projects > Forked.

Fork to a new tab

You can open your fork in a new tab by pressing Command (Mac) or Control (PC) clicking the Fork button.

Note that popup blockers may block the new tab. If opening your fork is blocked, you can click the “View Fork” link in the banner at the top of the original Pen to go to your fork.

You can adjust your popup settings in your browser to allow codepen.io — forks in a new tab are the only thing we use a “popup” for.

What happens when a fork is forked?

When a new fork is created from a Pen or Project that is a fork of another Pen, the new fork is considered a child of the original.

For example: you create Pen A. Another member forks your Pen to create Pen B. Then, a third member forks Pen B to create Pen C.

Pen C is a child of your Pen A, and will include a link to your Pen A on its Details View.

Other fork differences

  • Forks aren’t shown in search by default, but you can expand your search to include forks by setting “Show forks” to “True” on the search result page.
  • We avoid picking forks, unless they are significantly different from the original.
Was this article helpful?