# Uniform compositions > A composition is a set of components that define an experience managed within Canvas. Source: https://docs.uniform.app/docs/guides/composition/compositions A [composition](https://docs.uniform.app/docs/guides/composition/glossary#composition) is a set of components that define an instance of a layout. ## Create a composition To create a composition, you choose what to base it on in the **Add composition** modal. 1. Navigate to the **Experience > Compositions** tab menu. 2. Click the **Add composition** button. This opens the **Add composition: Choose type** modal. ![The Add composition modal with a search field and sidebar on the left and a grid of composition type and pattern cards on the right.](https://docs.uniform.app/images/guides/patterns/create-composition-from-composition-pattern.png) 3. Choose what to base the composition on: - Select a **composition type** card to start from a blank composition. Composition types are the components that are marked as composition components in the [component library](https://docs.uniform.app/docs/guides/models/components). In all other ways, a composition component is identical to a "regular" component. - Select a **composition pattern** card to start from a pre-assembled [composition pattern](https://docs.uniform.app/docs/guides/patterns/composition-patterns). Pattern cards show a pattern icon and their publish status. 4. Use the sidebar and toolbar to find the right type or pattern: | Control | Description | | --- | --- | | Search | Filter the grid by keyword across the name and public ID. | | All | Show every composition type and pattern you can create. | | Patterns By Type | Filter the grid to a single composition type and its patterns. The parent composition type is also included. | | Categories | Browse composition types and patterns grouped by their assigned category. | | Sort | Order the grid **A-Z** or by **Recently updated**. | | Suggested (From Filters) | Surfaces composition types that match the filters currently applied to the compositions list. | Uniform creates the composition as a draft and opens it in the [visual editor](https://docs.uniform.app/docs/guides/composition/visual-editing). New compositions start with a default name (such as "Page composition") that you can change at any time. ### Name and slug Every composition has a **name**, and can also have a **slug**: - The **name** is a label for the composition. It doesn't affect how the composition is used — for example, if the composition represents a web page, the name doesn't become part of the page URL. It does, however, help you find the composition when you search and filter the compositions list. - The **slug** is a human-readable identifier for the composition, useful when a composition needs to be fetched programmatically. It gives you a stable, readable value to query by instead of the composition ID. Whether the slug is required, optional, or hidden depends on the composition type's slug settings. You can edit the name from the composition header, and the slug from the **Properties** panel in the visual editor, at any time after the composition is created. When you create a composition through a [project map](https://docs.uniform.app/docs/guides/composition/url-management) node, its initial slug matches the path segment of that node. > **Note:** > > A composition isn't available to a front-end application until it's published. Any later changes to the composition must be re-published before they're available to the front-end application. > **No composition types yet?:** > > If your project doesn't have any composition types, clicking **Add composition** takes you to the [component library](https://docs.uniform.app/docs/guides/models/components) to create a composition type first. A composition type is a component with composition behavior enabled. ## Open a composition There are several ways to open a composition, allowing users to access them in the most convenient way for you. ### From project map node If a project map is configured for the project, you can: 1. Go to **Experience > Compositions**, then select **Project map** under **Manage in** in the sidebar. 2. Click on the name of a node or the and select **Open in Canvas**. ### From composition landing page Use the main navigation and go to **Experience > Compositions**. This is also available from any landing page within the content section. > **Organize and find your compositions:** > > Use [favorites](https://docs.uniform.app/docs/guides/content-organization/favorites) to bookmark the compositions you use most, [My recents](https://docs.uniform.app/docs/guides/content-organization/my-recents) to return to compositions you recently worked on, and [search, filter, and sort](https://docs.uniform.app/docs/guides/content-organization/search-filter-sort) to find a specific composition. When you keep rebuilding the same search, save it as a [custom view](https://docs.uniform.app/docs/guides/content-organization/custom-views). ### From another composition To stay within your editing flow, you can switch to editing a different composition without leaving the visual editing experience. With a composition open in the visual editor, click **Open…** in the top navigation bar, next to **Composition editor**. Hovering over the button shows the tooltip _Open a different composition_. (The button isn't shown when you're editing a [composition pattern](https://docs.uniform.app/docs/guides/patterns/composition-patterns).) ![The composition editor top navigation bar with the Open option used to switch to a different composition.](https://docs.uniform.app/images/guides/composition/contextual-editing/open-component-selection.png) Clicking **Open…** opens the **Open composition** modal, which offers several ways to find and switch to another composition. ![The Open composition modal with a keyword search and Project map and All views in the sidebar, listing compositions with their type, publish status, and last modified date.](https://docs.uniform.app/images/guides/composition/contextual-editing/switch-components.png) - **Search by keyword** using the search field at the top of the sidebar. - Switch between the two views under **Views** in the sidebar: - **Project map** browses compositions through your project map tree. This view is only available when a project map is configured for the project. - **All** shows a flat, paginated list of every composition, with the most recently updated first. - In the **All** view, each row shows the composition's name, type, publish status, and when it was last modified. Use the pager and the **Results per page** control (10, 25, or 50) to move through long lists. The composition you currently have open is marked **current** and can't be reselected. Selecting another composition opens it in the editor in place. If the current composition has unsaved changes, your browser prompts you to confirm before switching. ## Manage a composition You can manage component settings from the **components** list but if you want to manage the information of an _instance_ of a component, that's done within the composition. 1. Navigate to **Experience > Compositions**. 2. Select which composition you would like to work with. You will be taken to the [visual editing view](https://docs.uniform.app/docs/guides/composition/visual-editing) of your composition. From here you can: - Enter data into the parameters of compositions - [Connect the component to external data](https://docs.uniform.app/docs/guides/composition/connect-external-data) - [Configure preview](https://docs.uniform.app/docs/guides/composition/visual-editing/preview-mode) for visual editing. ## Delete a composition 1. Navigate to the **Experience > Compositions** tab menu. 2. Find the composition you want to delete and click ** > Delete**. The composition moves to [Trash](https://docs.uniform.app/docs/guides/content-organization/trash). ## Duplicate a composition When you duplicate a composition, you create a new composition with all the same settings as the original composition, with the following exceptions: - The composition name gets " (copy)" added to the end. - The slug gets "-copy" added to the end. - The composition state is set to "draft." The following steps describe how to duplicate a composition. 1. Navigate to the **Experience > Compositions** tab menu. 2. Find the composition you want to duplicate and click ** > Duplicate**.