К основному содержанию
правило

Tailwind + shadcn/ui — правило для Cursor: установка

Правило задаёт стиль работы Cursor с Tailwind и shadcn/ui: просит сначала расписать план, а затем писать читаемый код на TypeScript и Next.js.

Установить в Cursor · Вручную: положить файлы Все способы и платформы ↓
.cursor/rules/tailwind-shadcn-ui-integration-cursorrules-prompt-.mdc
Открыть на GitHub

Что делает tailwind-shadcn-ui-integration-cursorrules-prompt-

Правило настраивает ответы помощника для задач с Tailwind и shadcn/ui. Оно ориентирует Cursor на читаемый код на TypeScript и Next.js, полную реализацию запрошенных функций и проверку результата. Перед написанием кода помощник должен изложить план в псевдокоде и получить подтверждение.

Правило также задаёт расположение файлов в src и просит включать нужные импорты, давать компонентам понятные имена и не оставлять заглушки. Здесь есть несоответствие: инструкции адресованы помощнику в VSCode, а файл предназначен для Cursor. Путь src важен для проектов, где исходники лежат именно в этой папке.

Какие задачи решает

  • задать стиль кода для задач с Tailwind и shadcn/ui
  • попросить агента сначала согласовать план реализации
  • направить работу с файлами в папку src
  • избежать незаконченных функций и пропущенных импортов

Примеры запросов агенту

  • Сделай компонент интерфейса на TypeScript и Next.js с Tailwind и shadcn/ui; сначала предложи план.
  • Добавь запрошенную функцию в проекте, где исходники находятся в src, и проверь итоговый код.

Как установить tailwind-shadcn-ui-integration-cursorrules-prompt-

Вручную: положить файлы

.cursor/rules/tailwind-shadcn-ui-integration-cursorrules-prompt-.mdc

Во frontmatter: description, globs, alwaysApply

По шагам, с командами для каждой платформы: Cursor rules: файлы .mdc, четыре режима и замена .cursorrules

Вопросы о tailwind-shadcn-ui-integration-cursorrules-prompt-

Как установить правило Tailwind + shadcn/ui в Cursor?

Добавьте файл правила по пути .cursor/rules/tailwind-shadcn-ui-integration-cursorrules-prompt-.mdc.

Что делает это правило?

Оно задаёт рекомендации для работы с Tailwind и shadcn/ui: читаемый код на TypeScript и Next.js, план до реализации и проверка готового результата.

Куда правило направляет исходные файлы?

В папку src. Это стоит учитывать, если в проекте исходники размещены в другом каталоге.

Исходный текст

tailwind-shadcn-ui-integration-cursorrules-prompt-.mdc · CC0-1.0
---
description: "Cursor rules for Tailwind development with shadcn/ui integration."
globs: **/*
alwaysApply: false
---
You are an expert AI programming assistant in VSCode that primarily focuses on producing clear, readable Typescript NextJS code.

You are thoughtful, give nuanced answers, and are brilliant at reasoning. You carefully provide accurate, factual, thoughtful answers, and are a genius at reasoning.

Follow the user’s requirements carefully & to the letter.

First think step-by-step - describe your plan for what to build in pseudocode, written out in great detail.

Confirm, then write code!

Always write correct, up to date, bug free, fully functional and working, secure, performant and efficient code.

Focus on readability over being performant.

Fully implement all requested functionality.

Leave NO todo’s, placeholders or missing pieces.

Ensure code is complete! Verify thoroughly finalized.

Include all required imports, and ensure proper naming of key components.

Be concise. Minimize any other prose.

If you think there might not be a correct answer, you say so. If you do not know the answer, say so instead of guessing.

Tech Stack

Files are located inside the src folder.

© PatrickJS · CC0-1.0 · PatrickJS/awesome-cursorrules

Похожие правила IDE

Все правила IDE по теме «Фронтенд и UI» →
winui3 официальный github Правило задаёт рекомендации для WinUI 3 и Windows App SDK: от XAML и потоков до окон и MVVM. Пригодится, чтобы Copilot учитывал особенности настольных приложений Windows. ★ 40 451звёзд репо vue официальный github Правило задаёт Copilot стандарты Vue 3: Composition API, <script setup>, реактивность, Pinia и Vue Router. Пригодится, когда агент пишет компоненты в вашем стиле. ★ 40 451звёзд репо tanstack-start-shadcn-tailwind официальный github Правило задаёт Copilot стек TanStack Start, Shadcn/ui и Tailwind CSS и требует валидировать внешние данные через Zod. ★ 40 451звёзд репо tailwind-v4-vite официальный github Правило помогает подключить Tailwind CSS v4 к проекту на Vite через официальный плагин. Пригодится и для новой установки, и при переходе с v3. ★ 40 451звёзд репо svelte официальный github Направляет GitHub Copilot на стандарты Svelte 5 и SvelteKit 2: руны вместо старых сторов, типизация компонентов и безопасная работа с SSR. ★ 40 451звёзд репо power-bi-custom-visuals-development официальный github Правило для GitHub Copilot, которое подсказывает агенту, как писать кастомные визуалы Power BI на React, D3.js и TypeScript. ★ 40 451звёзд репо

Из того же набора210

tanstack-start-cursorrules-prompt-file Правило задаёт Cursor ориентиры для разработки на TanStack Start: от серверных функций и маршрутов до потоковой загрузки и SSR. ★ 41 024звёзд репо tanstack-router Правило для Cursor, которое задаёт агенту стандарты TanStack Router v1: файловые маршруты, типизация параметров и загрузка данных через loader. ★ 41 024звёзд репо tanstack-query Правило задаёт для Cursor шаблоны работы с TanStack Query v5 в TypeScript и React. Оно пригодится при запросах, мутациях, пагинации и Suspense. ★ 41 024звёзд репо tanstack-query-v5-cursorrules-prompt-file Правило для Cursor, которое задаёт агенту стиль работы с TanStack Query v5: ключи запросов, мутации, оптимистичные обновления, Suspense и префетчинг. ★ 41 024звёзд репо tailwind-react-firebase-cursorrules-prompt-file Правило для Cursor задаёт, как писать мобильное веб-приложение на Tailwind, React и Firebase: сначала мобильная вёрстка, потом остальное. ★ 41 024звёзд репо swiftui-guidelines-cursorrules-prompt-file Правило задаёт рекомендации для SwiftUI-кода: от архитектуры и конкурентности до тестов и превью. Подключите его, чтобы Cursor учитывал эти требования при работе с проектом. ★ 41 024звёзд репо sveltekit-typescript-guide-cursorrules-prompt-file Правило для Cursor, которое настраивает агента на Svelte 5, SvelteKit и TypeScript: структура проекта, руны, состояние. ★ 41 024звёзд репо sveltekit-tailwindcss-typescript-cursorrules-promp Задаёт стандарты стека SvelteKit 2, Tailwind CSS и TypeScript для Cursor. Помогает генерировать типизированные компоненты с правильной структурой файлов. ★ 41 024звёзд репо

Спонсоры проекта

Компании, которые помогают держать аналитику открытой