[Документация Yandex Cloud](../../index.md) > [Yandex DataLens](../index.md) > [Настройки сервиса](index.md) > Оформление # Настройки оформления в Yandex DataLens Настройки оформления позволяют изменить настройки внешнего вида интерфейса для всей организации: * Настроить [стилизацию интерфейса](#ui-customization). * Добавить, изменить или удалить [цветовые палитры](#palette-settings) чартов. Изменить настройки может [администратор](../security/roles.md#datalens-admin) экземпляра DataLens (роль `datalens.admin`). Чтобы перейти к настройкам оформления: 1. На панели слева выберите ![image](../../_assets/console-icons/sliders.svg) **Настройки сервиса**. Если на панели не отображается ![image](../../_assets/console-icons/sliders.svg), сначала выберите ![image](../../_assets/console-icons/ellipsis.svg) **Ещё**, а затем — ![image](../../_assets/console-icons/sliders.svg) **Настройки сервиса**. 1. Выберите вкладку **Оформление**. ![image](../../_assets/datalens/settings/customization.png) ## Стилизация интерфейса {#ui-customization} Стилизация интерфейса в DataLens позволяет настроить внешний вид интерфейса вашей инсталляции сервиса: цвета, логотип и оформление отдельных элементов. Изменить настройки стилизации может [администратор](../security/roles.md#datalens-admin) экземпляра DataLens (роль `datalens.admin`). Чтобы настроить внешний вид интерфейса: 1. Перейдите на [главную страницу](https://datalens.ru/?skipPromo=true) DataLens. 1. На панели слева выберите ![image](../../_assets/console-icons/sliders.svg) **Настройки сервиса**. 1. Выберите вкладку **Оформление**. 1. В разделе **Стилизация интерфейса** нажмите кнопку ![image](../../_assets/console-icons/palette.svg) **Настроить**. {% cut "Настроить стилизацию" %} ![image](../../_assets/datalens/settings/ui-customization.png) {% endcut %} 1. Настройте оформление: * **Тема интерфейса** — выберите тему интерфейса, для которой задается цветовая палитра. * **Контрастность** — выберите контрастность, для которой задается цветовая палитра. * **Цветовая палитра** — набор цветов для выбранной темы интерфейса и контрастности. Для каждого сочетания темы и контрастности можно настроить уникальную палитру. Цвета можно задать вручную или сгенерировать: {% list tabs %} - Вручную * **Основной цвет** — используется в качестве фона для кнопок и элементов управления: переключателей, чекбоксов и селекторов. Также основной цвет используется в качестве темы для всплывающих подсказок. * **Основной цвет при наведении курсора** — при ручной настройке можно выбрать любой цвет. При генерации палитры автоматически задается более темный оттенок основного цвета. * **Фон страницы** — цвет фона страницы. Для светлой темы чаще всего используется белый цвет. Для темной темы выбор цветов более широкий: от нейтральных серых оттенков до теплых или холодных цветов. * **Фон дашборда** — цвет фона для дашборда по умолчанию. Пользователь может [переопределить](../operations/dashboard/add-dashboard-background.md) его для конкретного дашборда. * **Фон виджета** — цвет и прозрачность фона для виджета по умолчанию. Пользователь может [переопределить](../operations/dashboard/add-widget-background.md) его для всех виджетов конкретного дашборда или настроить для каждого виджета отдельно. * **Фон элементов поверх страницы** — используется в качестве фона для карточек и других элементов, размещенных поверх фона страницы. Не влияет на цвет фона виджетов. * **Выбранные элементы** — цвет для выбранных элементов, например: нажатой кнопки, выбранной строки или выделенного текста. * **Выбранные элементы при наведении курсора** — цвет для выбранных элементов (например, нажатой кнопки, выбранной строки) при наведении на них курсора. * **Текст на выбранных элементах** — цвет текста на выбранных элементах. Задайте его контрастным по отношению к цвету выбранных элементов. * **Линии и обводки** — цвет активной карточки или таба, а также цвет индикатора загрузки. * **Ссылка** — цвет для текста ссылки. * **Ссылка при наведении курсора** — цвет для текста ссылки при наведении на него курсора. - Сгенерировать Нажмите кнопку ![image](../../_assets/console-icons/arrows-rotate-left.svg) **Сгенерировать палитру** и выберите основной цвет. На его основе автоматически сгенерируются остальные цвета. При необходимости отредактируйте цветовые настройки вручную. {% endlist %} * **Контрастный цвет** — выберите цвет для текста на кнопке. * **Логотип и фавиконка** — чтобы заменить логотип и фавиконку, [загрузите](../../storage/quickstart.md#upload-files) в хранилище Yandex Object Storage файл формата SVG в пропорции 1:1. Затем скопируйте ссылку на файл в хранилище и вставьте ее в это поле. Справа от поля нажмите кнопку **Применить**. * **Скругление** — задает скругление углов элементов интерфейса: * **Кнопка** — выберите из предустановленных вариантов. * **Виджеты** — выберите из предустановленных вариантов или включите опцию **Указать своё значение** и введите значение от `0` до `24` с шагом `2`. {% note info %} В области предпросмотра отображается внешний вид элементов интерфейса с заданными настройками. {% endnote %} 1. Вверху справа нажмите кнопку **Сохранить**. 1. Чтобы применить настроенную стилизацию, включите опцию в разделе **Стилизация интерфейса**. ## Управление цветовой палитрой чартов {#palette-settings} В Yandex DataLens вы можете [создать](#create-palette), [изменить](#edit-palette), [удалить](#delete-palette) цветовую палитру и [настроить цветовую палитру по умолчанию](#default-palette). ### Создать цветовую палитру {#create-palette} {% note warning %} Для создания палитры пользователю нужна роль [администратора](../security/roles.md#datalens-admin) экземпляра DataLens. {% endnote %} Чтобы создать цветовую палитру: 1. Перейдите на [главную страницу](https://datalens.ru/?skipPromo=true) DataLens. 1. На панели слева выберите ![image](../../_assets/console-icons/sliders.svg) **Настройки сервиса**. 1. Выберите вкладку **Оформление**. 1. В разделе **Палитры** добавьте новую палитру: {% list tabs %} - Градиентная цветовая палитра Градиентная цветовая палитра применяется в чартах для числовых показателей. 1. В подразделе **Градиентные цветовые палитры** нажмите кнопку **+ Добавить палитру**. 1. В открывшемся окне введите параметры: * Вверху введите **Название палитры**. * Внизу слева введите начальное, а справа — конечное значение цвета для градиента в шестнадцатеричном формате. Например, введите `0044A3` слева и `8CCBFF` справа для изменения градиента от темно-синего до светло-голубого. Чтобы добавить промежуточное значение для градиента, внизу нажмите значок ![image](../../_assets/console-icons/plus.svg) и введите значение. Изменения отобразятся в окне предпросмотра. 1. Нажмите кнопку **Сохранить**. - Цветовая палитра Цветовая палитра применяется в чартах для дискретных значений: названий показателей, значений измерений. 1. В подразделе **Цветовые палитры** нажмите кнопку **+ Добавить палитру**. 1. В открывшемся окне введите параметры: * Вверху введите **Название палитры**. * В списке справа нажмите **+ Добавить цвет** и введите значения для цветов палитры в шестнадцатеричном формате. По умолчанию заданы значения для двадцати цветов. Вы можете изменить, добавить или удалить цвета палитры. Чтобы изменить порядок цветов, перетащите их указателем. Изменения отобразятся в окне предпросмотра. 1. Нажмите кнопку **Сохранить**. {% endlist %} ### Изменить цветовую палитру {#edit-palette} Чтобы изменить цветовую палитру: 1. Перейдите на [главную страницу](https://datalens.ru/?skipPromo=true) DataLens. 1. На панели слева выберите ![image](../../_assets/console-icons/sliders.svg) **Настройки сервиса**. 1. Выберите вкладку **Оформление**. 1. В разделе **Палитры** нажмите на строку с палитрой, которую хотите изменить. 1. В окне **Настройка цветовых палитр** внесите изменения. 1. Нажмите кнопку **Сохранить**. ### Удалить цветовую палитру {#delete-palette} {% note info %} После удаления цветовой палитры в чартах, в которых она использовалась, [цветовые настройки](../concepts/chart/settings.md#color-settings) сбросятся до исходных. {% endnote %} Чтобы удалить цветовую палитру: 1. Перейдите на [главную страницу](https://datalens.ru/?skipPromo=true) DataLens. 1. На панели слева выберите ![image](../../_assets/console-icons/sliders.svg) **Настройки сервиса**. 1. Выберите вкладку **Оформление**. 1. В разделе **Палитры** наведите указатель на название палитры, которую хотите удалить. 1. Справа нажмите на значок ![image](../../_assets/console-icons/ellipsis.svg) и выберите **Удалить**. 1. Нажмите кнопку **Удалить**. ### Настроить цветовую палитру по умолчанию {#default-palette} Для экземпляров DataLens, созданных до 16 сентября 2025 года, настроена палитра по умолчанию `Classic 20`. Для экземпляров, созданных после 16 сентября 2025 года, палитра по умолчанию — `Default 20`. Чтобы настроить цветовую палитру по умолчанию на любую из предустановленных или ранее добавленных: 1. Перейдите на [главную страницу](https://datalens.ru/?skipPromo=true) DataLens. 1. На панели слева выберите ![image](../../_assets/console-icons/sliders.svg) **Настройки сервиса**. 1. Выберите вкладку **Оформление**. 1. В разделе **Палитры** выберите из списка палитру по умолчанию. Палитра по умолчанию будет применена ко всем чартам, использующим палитру по умолчанию. В чартах с настроенными палитрами изменений палитры не будет. При удалении цветовой палитры по умолчанию палитра `Default 20` будет использоваться вместо удаляемой. Она будет применена ко всем чартам, использующим палитру по умолчанию.