diff --git a/pages/docs/getting-started.mdx b/pages/docs/getting-started.mdx
index 1602c09..e6c74ee 100644
--- a/pages/docs/getting-started.mdx
+++ b/pages/docs/getting-started.mdx
@@ -115,16 +115,18 @@ To enable autocompletion for **Tailwind Variants** you can follow the instructio
 
 <Tabs items={['VSCode', 'Neovim', 'IntelliJ']}>
   <Tab>
-    If you are using **VSCode** and the [**TailwindCSS IntelliSense Extension**](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss), you have to add the following to your `settings.json` file.
+     If you are using **VSCode** and the [**TailwindCSS IntelliSense Extension**](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss), you can enable autocompletion for Tailwind Variants by adding the following to your `settings.json` file. 
 
     ```json copy
     {
-      "tailwindCSS.experimental.classRegex": [
-        ["([\"'`][^\"'`]*.*?[\"'`])", "[\"'`]([^\"'`]*).*?[\"'`]"]
-      ]
+      "tailwindCSS.classFunctions": ["tv"]
     }
     ```
 
+This configuration replaces the older approach where you needed to use tailwindCSS.experimental.classRegex. The new method is simpler and enables autocompletion for Tailwind Variants with just the classFunctions setting.
+
+For more information, check the official Tailwind CSS IntelliSense Documentation. </Tab>
+
   </Tab>
   <Tab>
     If you are using **Neovim**, install [**Tailwind CSS Language Server**](https://github.com/neovim/nvim-lspconfig/blob/master/doc/server_configurations.md#tailwindcss) and add the following to your configuration.