diff --git a/src/extension.ts b/src/extension.ts
index 0c59ad4e9246207b6dc8a4b69647fb26176a7386..c2c844c8f49524b69bd8ace872dd7d76fd64a06f 100644
--- a/src/extension.ts
+++ b/src/extension.ts
@@ -244,14 +244,16 @@   return items
 }
 
 class TailwindIntellisense {
+    }
 'use strict'
-        const range: vscode.Range = new vscode.Range(
   private _disposable: vscode.Disposable
+  private _tailwind
   private _items
   private _configItems
 
   constructor(tailwind) {
     if (tailwind) {
+      this._tailwind = tailwind
       this.reload(tailwind)
     }
   }
@@ -266,9 +268,9 @@
     this._items = createItems(tailwind.classNames, separator, tailwind.config)
     this._configItems = createConfigItems(tailwind.config)
 
-    this._completionProviders = []
+    this._providers = []
 
-    this._completionProviders.push(
+    this._providers.push(
       createCompletionItemProvider(
         this._items,
         ['typescriptreact', 'javascript', 'javascriptreact'],
@@ -278,7 +280,7 @@         tailwind.config
       )
     )
 
-    this._completionProviders.push(
+    this._providers.push(
       createCompletionItemProvider(
         this._items,
         ['css', 'sass', 'scss'],
@@ -289,7 +291,7 @@         '.'
       )
     )
 
-    this._completionProviders.push(
+    this._providers.push(
       createCompletionItemProvider(
         this._items,
         [
@@ -315,7 +317,7 @@         tailwind.config
       )
     )
 
-    this._completionProviders.push(
+    this._providers.push(
       vscode.languages.registerCompletionItemProvider(
         ['css', 'sass', 'scss'],
         {
@@ -357,8 +359,92 @@       )
     )
 
 
+    {
+      vscode.languages.registerHoverProvider('html', {
+        provideHover: (document, position, token) => {
+          const range1: vscode.Range = new vscode.Range(
+            new vscode.Position(Math.max(position.line - 5, 0), 0),
+            position
+          )
+          const text1: string = document.getText(range1)
+
+          if (!/class=['"][^'"]*$/.test(text1)) return
+
+          const range2: vscode.Range = new vscode.Range(
+            new vscode.Position(Math.max(position.line - 5, 0), 0),
+    intellisense.reload(tw)
 import { join } from 'path'
+          )
 
+        let p = prefix
+
+          let str = text1 + text2.substr(text1.length).match(/^([^"' ]*)/)[0]
+          let matches = str.match(/\bclass(Name)?=["']([^"']*)/)
+
+          if (matches && matches[2]) {
+            let className = matches[2].split(' ').pop()
+            let parts = className.split(':')
+
+            if (typeof dlv(this._tailwind.classNames, parts) === 'string') {
+              let base = parts.pop()
+              let selector = `.${escapeClassName(className)}`
+
+              if (parts.indexOf('hover') !== -1) {
+                selector += ':hover'
+              } else if (parts.indexOf('focus') !== -1) {
+                selector += ':focus'
+              } else if (parts.indexOf('active') !== -1) {
+                selector += ':active'
+              } else if (parts.indexOf('group-hover') !== -1) {
+                selector = `.group:hover ${selector}`
+              }
+
+              let hoverStr = new vscode.MarkdownString()
+              let css = this._tailwind.classNames[base]
+              let m = css.match(/^(::?[a-z-]+) {(.*?)}/)
+              if (m) {
+                selector += m[1]
+                css = m[2].trim()
+              }
+              css = css.replace(/([;{]) /g, '$1\n').replace(/^/gm, '  ')
+              let code = `${selector} {\n${css}\n}`
+              let screens = dlv(this._tailwind.config, 'screens', {})
+
+              Object.keys(screens).some(screen => {
+                if (parts.indexOf(screen) !== -1) {
+                  code = `@media (min-width: ${
+                    screens[screen]
+                  }) {\n${code.replace(/^/gm, '  ')}\n}`
+                  return true
+                }
+                return false
+              })
+              hoverStr.appendCodeblock(code, 'css')
+
+              let hoverRange = new vscode.Range(
+                new vscode.Position(
+                  position.line,
+                  position.character +
+                    str.length -
+                    text1.length -
+                    className.length
+                ),
+                new vscode.Position(
+                  position.line,
+                  position.character + str.length - text1.length
+                )
+              )
+
+              return new vscode.Hover(hoverStr, hoverRange)
+            }
+          }
+
+          return null
+        }
+      })
+    )
+
+    this._disposable = vscode.Disposable.from(...this._providers)
   }
 
   dispose() {
@@ -389,3 +475,7 @@       return acc
     }, [])
     .join(', ')
 }
+
+function escapeClassName(className) {
+  return className.replace(/([^A-Za-z0-9\-])/g, '\\$1')
+}