Всем "вайбкодерам", которым сложно сформулировать свои желания, и бэкенд-разработчикам, не знающим фронтенд.

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

Вместо "чтобы открывалось справа" или "выскакивало снизу" — указывайте, нужен ли вам drawer, sheet или modal. Даже простое знание названий меняет результат.

У этого сайта есть ещё пара плюсов. https://namethatui.com/

Во-первых, невозможно попросить то, о существовании чего вы не знаете. Тот, кто знаком с термином "scrim", понимает, что затемнение фона за модальным окном — это отдельное дизайнерское решение. Тот, кто не знает этого термина, даже не спросит об этом и просто примет то, что выдастся по умолчанию.

Во-вторых, это позволяет вам оценивать результат. Если вы можете сказать "здесь ты использовал spinner вместо skeleton" - вы действительно итерируете. Если не можете - единственное, что остаётся сказать: "не сработало, сделай ещё раз".

Есть ещё раздел "styles" - не пропустите его.

Хватит говорить "сделай вот так" или "сделай как у Apple", присылая скриншоты. Минимализм, брутализм или flat design. Там объясняется, что это за стиль и его отличительные черты, а внизу - готовый style brief, который можно сразу вставить в AI-агента.

На странице минимализма, например, предлагается: "Оставьте 40-60% viewport пустым, используйте один акцентный цвет и один яркий заголовок". Если задать эти параметры заранее, не придётся проходить через бесконечные раунды правок.

внутри:
- 76 элементов, отдельные версии для web и macOS
- настоящее название, API-эквивалент и готовый промпт для каждого
- библиотека стилей + готовый бриф для копирования под каждый стиль
- отдельный раздел для элементов, которые легко перепутать @devs_kz