Конструктор запроса на тему

Выберите, каким должен ощущаться ваш сайт. Запрос справа следует правилам тем v1.5, поэтому AI сделает файл, который можно сразу загрузить.

Настроение

Минимализм и чистота Кассета из 90-х Неоновый ночной город Уютное акустическое кафе Lo-fi студия в спальне Классический концертный зал Яркая K-pop сцена Тихий лес и дождь

Светлая или тёмная Светлая Тёмная

Цвета Фон Акцент

Углы Прямые Слегка скруглённые Сильно скруглённые

Ваш запрос

[Желаемый вид: ป่าสงบกับสายฝน, фон #f6f3ee, акцентный цвет #d2462f, слегка скруглённые углы (около 8px), светлая тема (тёмный текст на светлом фоне). Используй именно эти цвета для --aml-bg и --aml-accent / --aml-accent-fill.]

В описанном выше стиле сделай один HTML-файл «скина» (темы) для моего музыкального сайта. Строго соблюдай эти правила.

[Правила]
1. Один HTML-файл. Весь CSS — в одном <style> внутри <head>. Коротко: не больше 30KB.
2. Запрещено: <script>, атрибуты on…= вроде onclick, javascript:, iframe, frame, object, embed, form, input, button, textarea, select,
   link, base, meta http-equiv, @import, url(http…), внешние картинки и внешние веб-шрифты. Если нужен узор — используй CSS-градиент.
3. Строки песен, меню, плеер, альбомы и гостевую книгу рисует сам сайт. Я выбираю только цвета и расположение. Используй ровно этот каркас:
   <!doctype html><html lang="{{lang}}"><head><meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
   <meta name="theme-color" content="(цвет фона)"><title>{{site_name}}</title><style> … </style></head>
   <body class="aml-kit">
   {{banner}}
   {{hero}}
   <div class="aml-bar">{{menu}}{{lang_select}}</div>
   {{ad_top}}
   {{content}}
   {{footer}}
   {{player}}
   </body></html>
   ({{menu}}, {{content}} и {{player}} должны встречаться ровно по одному разу. Никогда не пиши имена подстановок внутри комментариев.)
4. В :root внутри <style> задай все эти цветовые переменные (меняя только их, можно перекрасить весь сайт):
   --aml-bg (фон страницы) --aml-panel (строки песен, карточки) --aml-panel-2 (нажатые ячейки) --aml-text (текст) --aml-muted (второстепенный текст)
   --aml-line (тонкие линии) --aml-glass (панель меню и плеер, полупрозрачные: rgb(… / .74))
   --aml-accent (акцентный текст и линии) --aml-accent-fill (фон кнопок) --aml-accent-ink (текст кнопок)
   --aml-hero-a (сколько цвета профиля подмешивать в шапку: 8% для светлой, 20% для тёмной) --aml-art-shadow (тень альбома или none)
   --aml-viz-color (полосы при воспроизведении) --aml-viz-opacity (0.18–0.25) --aml-viz-gap (3px)
   --aml-modal-bg --aml-modal-text (окно с текстом песни) --aml-footer-color --aml-social-color --aml-ext-color
   В --aml-font укажи список системных шрифтов устройства (например: -apple-system, "Pretendard Variable", Pretendard, system-ui, sans-serif).
5. Контраст текста с фоном — не меньше 4.5:1 (никакого серого на сером). Второстепенный текст (--aml-muted) тоже не меньше 4.5:1 на --aml-panel.
6. Чтобы украсить больше, добавь CSS к этим классам (только форма — не двигай и сильно не меняй размеры элементов):
   .aml-hero (шапка) .aml-hero-name (название сайта) .aml-profile (круглое фото) .aml-btn-primary (кнопка «слушать всё»)
   .aml-bar (панель меню) .aml-menu-item / .aml-menu-item.is-active (кнопки меню)
   .aml-section-title (заголовки) .aml-track (карточка строки песни) .aml-track.is-playing (играющая строка) .aml-track-title .aml-track-artist .aml-genres
   .aml-album-cover (обложка альбома) .aml-gb-form .aml-gb-post (гостевая книга) .aml-footer
   Не меняй положение и размер плеера (.aml-player) и визуализатора (.aml-viz) — только цвета.
7. Проверь, чтобы на телефоне (ширина 390px) всё выглядело хорошо. Встроенный дизайн уже подстроен под телефоны, поэтому не фиксируй ширину.

Покажи только готовый HTML-файл, одним блоком кода.

Скопируйте запрос и вставьте его в бесплатный ChatGPT или Claude.
Если ответ оборвался, напишите «продолжай».
Сохраните код как файл .html и проверьте его: Проверка тем
Загрузите его в админке, в разделе «Темы».