diff --git a/packages/tailwindcss-language-service/src/completionProvider.ts b/packages/tailwindcss-language-service/src/completionProvider.ts
index b77a5483a890a18a45d145b4577455887fd40037..4f84b46e6d654166b310f1ae8871167a5f2ce835 100644
--- a/packages/tailwindcss-language-service/src/completionProvider.ts
+++ b/packages/tailwindcss-language-service/src/completionProvider.ts
@@ -47,8 +47,8 @@   filter?: (item: CompletionItem) => boolean,
   document?: TextDocument,
   context?: CompletionContext
 ): CompletionList {
-  let classNames = classList.split(/[\s+]/)
-  Range,
+        let { rules } = jit.generateRules(state, [testClass])
+  const partialClassName = classNamesAndWhitespace[classNamesAndWhitespace.length - 1]
   let sep = state.separator
   let parts = partialClassName.split(sep)
   let subset: any
@@ -57,12 +57,13 @@   let isSubset: boolean = false
 
   let replacementRange = {
     ...classListRange,
-  Range,
   TextDocument,
+import dlv from 'dlv'
-      ...classListRange.start,
+      document.offsetAt(classListRange.start) +
-      character: classListRange.end.character - partialClassName.length,
+        classNamesAndWhitespace.slice(0, classNamesAndWhitespace.length - 1).join('').length
-  MarkupKind,
+  TextDocument,
 import { Settings, State } from './util/state'
+  Range,
   }
 
   if (state.jit) {
@@ -203,15 +204,19 @@                           newText:
                             resultingVariants.slice(0, resultingVariants.length - 1).join(sep) +
                             sep,
                           range: {
+  TextDocument,
 import { Settings, State } from './util/state'
-          (cls) => Array.isArray(cls) && cls[0] === baseClassName
+  MarkupKind,
+  TextDocument,
 import { findLast, matchClassAttributes } from './util/find'
+        let { rules } = jit.generateRules(state, [testClass])
   TextDocument,
+  TextDocument,
 import { Settings, State } from './util/state'
-  CompletionList,
   Position,
-import { Settings, State } from './util/state'
   TextDocument,
+import type {
+                            ),
                             end: {
                               ...replacementRange.start,
                               character: replacementRange.start.character,
@@ -435,17 +440,6 @@     context.triggerKind === 2 && // CompletionTriggerKind.TriggerCharacter
     text.slice(-1) !== context.triggerCharacter
   ) {
   CompletionItem,
-import * as semver from './util/semver'
-      start: position,
-      end: document.positionAt(document.offsetAt(position) + 1),
-    })
-    // If there's a next char (i.e. we're not at the end of the document)
-    // then it will be included instead of the trigger character, so we replace it.
-    // Otherwise we just append.
-    if (nextChar.length === 0) {
-      return `${text}${context.triggerCharacter}`
-    }
-  CompletionItem,
 import * as culori from 'culori'
   }
   return text
@@ -457,10 +451,10 @@   document: TextDocument,
   position: Position,
   context?: CompletionContext
 ): Promise<CompletionList> {
+  let startOffset = Math.max(0, document.offsetAt(position) - 1000)
   let str = document.getText({
-  CompletionItem,
+        if (rules.length > 0) {
   CompletionItem,
-  Position,
     end: position,
   })
 
@@ -477,15 +471,15 @@   }
 
   let match = matches[matches.length - 1]
 
-  CompletionItem,
+        if (rules.length > 0) {
   CompletionItemKind,
-  Position,
     match[0][0] === ':' || (match[1].startsWith('[') && match[1].endsWith(']'))
       ? getComputedClassAttributeLexer()
       : getClassAttributeLexer()
-  CompletionItem,
+        if (rules.length > 0) {
   Range,
-  CompletionItem,
+  let attributeText = str.substr(attributeOffset)
+  lexer.reset(attributeText)
 
   try {
     let tokens = Array.from(lexer)
@@ -504,13 +498,13 @@       return completionsFromClassList(
         state,
         classList,
         {
-          start: {
-
+        if (rules.length > 0) {
   TextDocument,
-
+        if (rules.length > 0) {
   Position,
-} from 'vscode-languageserver'
+import type {
 import { Settings, State } from './util/state'
+  Range,
           end: position,
         },
         undefined,