# Typography

The **Alukas** theme has a dedicated options panel of its own, which lets you customize the styling of each part of your site to the finest detail. You can set the font style and size for the text.

{% hint style="success" %}
Steps

1. In the theme editor (**Customize**), click **Theme settings**
2. Locate **Typography**
3. Make necessary changes
4. **Save**
   {% endhint %}

Typography is considered one of the essential components that impact the website's look and feel. It contains the following elements.

## **Body text** <a href="#id-1.-body-text-and-headings" id="id-1.-body-text-and-headings"></a>

You can either choose the existing fonts from the library, from google or custom fonts.&#x20;

<figure><img src="/files/x7QKUtxFs110Mx65Ex9x" alt=""><figcaption></figcaption></figure>

Elements related to the font such as spacing, height, weight, etc. are adjustable.

## Heading font

The font used for headings is configured to maintain consistency with the body text, ensuring a uniform appearance throughout the document. This includes similar font styles, sizes, and weights, providing a cohesive visual experience for the reader.

<figure><img src="/files/w461qgF5HgAHiaNjXFdu" alt=""><figcaption></figcaption></figure>

The heading font is subject to more detailed customization, featuring distinct settings that differentiate it from the body text. This includes adjustments in font size, weight, and style, tailored to enhance readability and hierarchical structure within the document.

<figure><img src="/files/saQZF7WS4c7eIKV6Mqgx" alt=""><figcaption></figcaption></figure>

## **Menu** <a href="#id-3.-buttons" id="id-3.-buttons"></a>

The menu is configured with unique settings for font family, size, and weight, allowing it to stand out while still complementing the overall design. These individual adjustments help differentiate the menu from other text elements, enhancing navigation without disrupting the cohesive aesthetic of the document.

<figure><img src="/files/0N2RT0W1NV7mQtLYgr6G" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/qQtIJBG0r4VQc5pbDoof" alt=""><figcaption></figcaption></figure>

## Buttons <a href="#id-3.-buttons" id="id-3.-buttons"></a>

The button font is inherited from the body text. Use the slider to modify border radius, font size, etc. You can choose to display the button text in uppercase style.

<figure><img src="/files/XwZXzip4yCbQNt6S0SJv" alt=""><figcaption></figcaption></figure>


---

# 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://blueskytechco.gitbook.io/alukas-shopify/theme-settings/typography.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.