# Customize the Starter Kit

This lesson will teach you how to customize the Starter Kit.

## Outcome

A customized version of the site with your Home page image, site name, color theme, font, and perhaps a logo in the header.

## Takeaway

Learn how to:

* Navigate the editing area in the Content section.
* Interact with content properties.
* Upload images and use them with content items.
* Preview your changes before publishing the content to the site.

## Steps

1. Go to the *Home* page in the Content section.
2. Navigate to the *Design* group by scrolling down.

   ![Home page Design Group](/files/XDfXCpaYvS22digfTmOP)
3. Choose a different font and color theme.
   * Try different combinations and see what fits your site.
   * Click **Save** to save a draft of your changes. **Save** will not publish the changes to the website.
   * Click **Save and preview** to see how the page looks on different screen sizes.
4. Try changing the background image of the Home page.
   * Hover over the *Hero Background* thumbnail and click the trash icon to remove the current image.
   * You can now click the '+' to open a dialog where you can choose an image from the Media library or upload a new image.
   * Select the image you want and click **Submit**.
5. Find the *Sitename* property and change the name of the site.
   * This is shown in the site navigation menu.
   * If you want a logo instead of the Site Name you can upload and/or choose an image from the Media Library.
6. Click **Save and Publish** to publish the changes to the website.

To see the changes you've made go to the **Info** tab and click on the Link.

![Link to page](/files/MtAr70e0GyXUlvbwn5Gb)

## Summary

Nice job! In this lesson, you've learned to navigate and edit properties on a page. You've also learned the difference between the **Save**, **Preview**, and **Save and Publish** actions and how to use them.

[Back to Lessons](/umbraco-cms/tutorials/starter-kit/lessons.md)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.umbraco.com/umbraco-cms/tutorials/starter-kit/lessons/1-customize-the-starter-kit.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.