先に結論(30秒で直す)
VSCode 右下の言語モードが PostCSS のままだと、CSS の補完・予測変換(サジェスト)が出ないことがあります。
1. 編集中の.cssを開く
2. 右下の PostCSS をクリック
3. CSS を選択
所要時間:約1分・再起動不要。Tailwind 導入時に PostCSS Language Support を入れたあと、モードが PostCSS のまま残るケースがあります。
※本記事の「予測変換」「サジェスト」は、VS Code の IntelliSense によるコード補完候補を指します。日本語 IME の変換予測や、GitHub Copilot のゴーストテキスト(インライン提案)とは別の機能です。
開発環境まわりの他の記事は 学習ハブ(/learn/) にまとめています。
症状:補完・予測変換・サジェストが出ない
CSS を VSCode で編集中、プロパティ名の候補や import の補完がポップアップで出ない。別プロジェクトを開いても再現する場合は、プロジェクト固有ではなく エディタ側の設定を疑います。
よくある原因①:言語モードが PostCSS になっている
エディタ右下の言語モード表示が PostCSS のままだと、標準の CSS Language Features の補完と挙動が変わることがあります。
私の場合は、別フォルダでも同じ症状が出ました。ESLint や Prettier を無効化しても改善せず、最終的に言語モードの不一致が原因でした。

これを、「CSS」に変更したところ、いつものCSS編集時の自動補完が戻りました。

なぜ PostCSS になっていたかは不明ですが、Tailwind CSS 拡張と一緒に入る PostCSS Language Support の影響かもしれません。
よくある原因②:settings.json でサジェストがオフ
言語モードを直しても改善しない場合は、ユーザー設定を確認します。特に editor.quickSuggestions の other が off になっていないか、editor.suggestOnTriggerCharacters が無効になっていないかを見ます。
{
"editor.quickSuggestions": {
"other": "on",
"comments": "off",
"strings": "off"
},
"editor.suggestOnTriggerCharacters": true,
"editor.tabCompletion": "on"
}
設定 UI では、画面左下(アクティビティバー)の歯車アイコン → 設定 → 検索ボックスで「quick suggestions」と入力して確認できます。JSON を直接直すときは、設定画面右上の「ファイルを開く」アイコンから settings.json を開けます。

それでも直らないときのチェックリスト
- 右下の言語モードが CSS(Plain Text / PostCSS でないか)
settings.jsonのfiles.associationsで*.cssが postcss に固定されていないか- 組み込み CSS Language Features が無効化されていないか(拡張一覧)
:入力後に候補が出るか(editor.suggestOnTriggerCharacters)- コマンドパレット → Developer: Reload Window を実行
- 求めている補完の種類を確認(CSS プロパティ / Tailwind クラス / Copilot ゴーストは別機能)
よくある質問
補完・予測変換・サジェストは同じ機能ですか?
冒頭の注記のとおり、本記事ではいずれも IntelliSense の候補を指します。IME の変換予測や Copilot のゴーストテキストとは別です。
PostCSS と CSS の言語モードの違いは?
PostCSS モードでは PostCSS 向けの Language Service が動き、通常の .css 編集では CSS モードの方がプロパティ補完が期待どおりになることが多いです。
Cursor でも同じ対処で直りますか?
Cursor も VS Code 系なので、画面右下の言語モードやサジェスト設定の考え方は同じです。右下の表示が PostCSS のままだと、同様に CSS へ変更すると直ることが多いです。
import 文の補完(IntelliSense)が出ないときは?
まず右下の言語モードが JavaScript / TypeScript になっているか確認してください。PostCSS や Plain Text のままだと import 先の候補が出ません。言語モードを直しても改善しない場合は、editor.quickSuggestions の other が on か、editor.suggestOnTriggerCharacters が true かを settings.json で確認します。詳細は本記事の「原因②」とチェックリストを参照してください。
まとめ
補完が突然出なくなったときは、まず右下の 言語モードを確認してください。PostCSS → CSS で戻ることが多いです。それでも直らない場合は、settings.json と拡張機能を切り分けて確認しましょう。
関連する記事です。開発環境の話から、エージェント作業の進め方へつないでいます。
- Cursor 3.11 — Side Chats と会話検索(本線を止めずに別質問する)
- Kiro×Cursor の仕様駆動開発(進め方・ツール)
- 学習ハブ(/learn/)(読む順)

