# Генератор теней CSS

> Показывает тень CSS box-shadow и позволяет скопировать код.

[Open tool](https://www.toolcabana.com/ru/box-shadow) · [Разработка и данные](https://www.toolcabana.com/ru/category/developer-and-data)

Tool ID: box-shadow. Requested language: ru. Description language: ru. Complete guide translation: yes.

## Overview (en)

Color CSS shadow generator builds a box-shadow declaration from horizontal and vertical offsets, blur, spread, a shadow color and an opacity from 0 to 1, with an optional inset shadow. It shows a live preview card and outputs a ready-to-copy CSS line that writes the color as rgba.

## Supported tasks (ru)

Показывает тень CSS box-shadow и позволяет скопировать код.

## Steps (ru)

1. Настройте значения; предварительный результат рассчитывается по значениям по умолчанию.
2. Измените основные настройки или откройте расширенный режим для точной настройки результата.
3. Проверьте результат и скопируйте или скачайте его. Приостановите живые результаты для ручного запуска. Исходные данные или отдельные настройки длиной более 20 000 символов требуют явного запуска.

## Settings

- Смещение по горизонтали (px) (ru; key: x; type: number)
- Смещение по вертикали (px) (ru; key: y; type: number)
- Размытие (px) (ru; key: blur; type: number); minimum: 0; maximum: 200
- Растяжение (px) (ru; key: spread; type: number)
- Цвет тени (ru; key: color; type: color)
- Непрозрачность (ru; key: opacity; type: range); minimum: 0; maximum: 1
- Внутренняя тень (ru; key: inset; type: checkbox)

## Limitations (ru)

Используйте конечные числа, допустимые даты и диапазоны, указанные в элементах управления. Неверные значения вызывают ошибку без возможности скачать результат.

## Example input

```text
Hello ToolCabana
```

## Privacy and connections (ru)

Эта операция обрабатывает исходные данные в вашем браузере. Копирование и скачивание выполняются только по вашему действию; входные данные не сохраняются в учётной записи или истории.

## Questions (ru)

### How do I make an inset box shadow in CSS?

Turn on the Inset option. The generated declaration then starts with the inset keyword, and the preview card shows the shadow inside its edges instead of outside.

### How do I set the transparency of a CSS shadow?

Use the Opacity slider, from 0 to 1 in steps of 0.01. The chosen color is converted to rgba with that alpha value, so the default of 0.15 gives a soft shadow.

### What is the maximum blur for the shadow generator?

Blur accepts whole pixel values from 0 to 200. The horizontal and vertical offsets and spread can be negative, which moves or shrinks the shadow.

### Где обрабатываются мои данные?

Эта операция обрабатывает исходные данные в вашем браузере. Копирование и скачивание выполняются только по вашему действию; входные данные не сохраняются в учётной записи или истории.

### Каковы ограничения входных данных?

Используйте конечные числа, допустимые даты и диапазоны, указанные в элементах управления. Неверные значения вызывают ошибку без возможности скачать результат.

## Related tools

- [Certificate decoder](https://www.toolcabana.com/ru/certificate-decoder)
- [API request builder](https://www.toolcabana.com/ru/api-request)
- [JSON to Dart model](https://www.toolcabana.com/ru/json-to-dart)
- [JSON to TypeScript](https://www.toolcabana.com/ru/json-to-typescript)