diff --git a/packages/tailwindcss-intellisense/package.json b/packages/tailwindcss-intellisense/package.json
index bf408ed1a95f50e3c0f494aeb4b5604ee1b92be2..5e916bc2836c0d64724b01b0fa4130f7290693cc 100755
--- a/packages/tailwindcss-intellisense/package.json
+++ b/packages/tailwindcss-intellisense/package.json
@@ -163,15 +163,8 @@         "tailwindCSS.experimental.classRegex": {
           "type": "array",
           "scope": "language-overridable"
         },
-        "tailwindCSS.showPixelEquivalents": {
-          "type": "boolean",
-          "default": true,
-          "markdownDescription": "Show `px` equivalents for `rem` CSS values."
-        },
-        "tailwindCSS.rootFontSize": {
-          "type": "number",
-          "default": 16,
-          "markdownDescription": "Root font size in pixels. Used to convert `rem` CSS values to their `px` equivalents. See `#tailwindCSS.showPixelEquivalents#`."
+        "tailwindCSS.experimental.showPixelValues": {
+          "type": "boolean"
         }
       }
     }
diff --git a/packages/tailwindcss-intellisense/src/lsp/server.ts b/packages/tailwindcss-intellisense/src/lsp/server.ts
index 9e5243c34eed9a82c62f775038473dba056227fc..f99bbea7b6705ebb44e66e85c49e533970fff43d 100644
--- a/packages/tailwindcss-intellisense/src/lsp/server.ts
+++ b/packages/tailwindcss-intellisense/src/lsp/server.ts
@@ -48,9 +48,8 @@   emmetCompletions: false,
   includeLanguages: {},
   experimental: {
     classRegex: [],
+    showPixelValues: false,
   },
-  showPixelEquivalents: true,
-  rootFontSize: 16,
   validate: true,
   lint: {
     cssConflict: 'warning',
diff --git a/packages/tailwindcss-language-service/src/completionProvider.ts b/packages/tailwindcss-language-service/src/completionProvider.ts
index 77963b53531d34b9b4c72d01390143001c8b0339..f7655a0caf7c528dbcc183ab7c17299d2afc5c92 100644
--- a/packages/tailwindcss-language-service/src/completionProvider.ts
+++ b/packages/tailwindcss-language-service/src/completionProvider.ts
@@ -900,9 +900,8 @@     item.detail = await getCssDetail(state, className)
     if (!item.documentation) {
       const settings = await getDocumentSettings(state)
       const css = stringifyCss(item.data.join(':'), className, {
-        tabSize: dlv(settings, 'tabSize', 2),
-        showPixelEquivalents: dlv(settings, 'showPixelEquivalents', true),
-        rootFontSize: dlv(settings, 'rootFontSize', 16),
+        tabSize: dlv(settings, 'tabSize'),
+        showPixelValues: dlv(settings, 'experimental.showPixelValues'),
       })
       if (css) {
         item.documentation = {
@@ -933,10 +932,7 @@ }
 
 function stringifyDecls(
   obj: any,
-  {
-    showPixelEquivalents = false,
-    rootFontSize = 16,
-  }: Partial<{ showPixelEquivalents: boolean; rootFontSize: number }> = {}
+  { showPixelValues = false }: Partial<{ showPixelValues: boolean }> = {}
 ): string {
   let props = Object.keys(obj)
   let nonCustomProps = props.filter((prop) => !prop.startsWith('--'))
@@ -949,9 +945,7 @@   return props
     .map((prop) =>
       ensureArray(obj[prop])
         .map((value) => {
-          const px = showPixelEquivalents
-            ? remToPx(value, rootFontSize)
-            : undefined
+          const px = showPixelValues ? remToPx(value) : undefined
           return `${prop}: ${value}${px ? ` /*${px}*/` : ''};`
         })
         .join(' ')
@@ -966,8 +960,7 @@   }
   if (className.__rule === true) {
     const settings = await getDocumentSettings(state)
     return stringifyDecls(removeMeta(className), {
-      showPixelEquivalents: dlv(settings, 'showPixelEquivalents', true),
-      rootFontSize: dlv(settings, 'rootFontSize', 16),
+      showPixelValues: dlv(settings, 'experimental.showPixelValues', false),
     })
   }
   return null
diff --git a/packages/tailwindcss-language-service/src/hoverProvider.ts b/packages/tailwindcss-language-service/src/hoverProvider.ts
index 8326afb058ba45f667c5768bdee7a672724c2f57..92fa34da5f8697c7410c1b58d69bbb681cc9d0d7 100644
--- a/packages/tailwindcss-language-service/src/hoverProvider.ts
+++ b/packages/tailwindcss-language-service/src/hoverProvider.ts
@@ -96,9 +96,8 @@   const css = stringifyCss(
     className.className,
     dlv(state.classNames.classNames, [...parts, '__info']),
     {
-      tabSize: dlv(settings, 'tabSize', 2),
-      showPixelEquivalents: dlv(settings, 'showPixelEquivalents', true),
-      rootFontSize: dlv(settings, 'rootFontSize', 16),
+      tabSize: dlv(settings, 'tabSize'),
+      showPixelValues: dlv(settings, 'experimental.showPixelValues'),
     }
   )
 
diff --git a/packages/tailwindcss-language-service/src/util/remToPx.ts b/packages/tailwindcss-language-service/src/util/remToPx.ts
index 445bb60a399208f23b1ff74dd9bf773baf75c0fa..b9f18982ff65b4b4622e76022fd9be8d017656de 100644
--- a/packages/tailwindcss-language-service/src/util/remToPx.ts
+++ b/packages/tailwindcss-language-service/src/util/remToPx.ts
@@ -2,11 +2,7 @@ export function remToPx(
   value: string,
   rootSize: number = 16
 ): string | undefined {
-  if (/^-?[0-9.]+rem$/.test(value)) {
-    let number = parseFloat(value.substr(0, value.length - 3))
-    if (!isNaN(number)) {
-      return `${number * rootSize}px`
-    }
-  }
-  return undefined
+  return /^-?[0-9.]+rem$/.test(value)
+    ? `${parseFloat(value.substr(0, value.length - 3)) * rootSize}px`
+    : undefined
 }
diff --git a/packages/tailwindcss-language-service/src/util/state.ts b/packages/tailwindcss-language-service/src/util/state.ts
index 4835a71077a4e2a7bade9807f859ab458e26ce1c..117a8edaf0400a8f26eb4aadaa5a5218b6f01f4a 100644
--- a/packages/tailwindcss-language-service/src/util/state.ts
+++ b/packages/tailwindcss-language-service/src/util/state.ts
@@ -33,8 +33,6 @@   tabSize: number
   emmetCompletions: boolean
   includeLanguages: Record<string, string>
   validate: boolean
-  showPixelEquivalents: boolean
-  rootFontSize: number
   lint: {
     cssConflict: DiagnosticSeveritySetting
     invalidApply: DiagnosticSeveritySetting
@@ -45,6 +43,7 @@     invalidTailwindDirective: DiagnosticSeveritySetting
   }
   experimental: {
     classRegex: string[]
+    showPixelValues: boolean
   }
 }
 
diff --git a/packages/tailwindcss-language-service/src/util/stringify.ts b/packages/tailwindcss-language-service/src/util/stringify.ts
index 3aebd99b04d222b4c59512d2f996fd279f75bf7f..b7050f9ea224fdc8ce0c7d01afdc29829946834d 100644
--- a/packages/tailwindcss-language-service/src/util/stringify.ts
+++ b/packages/tailwindcss-language-service/src/util/stringify.ts
@@ -21,25 +21,14 @@   className: string,
   obj: any,
   {
     tabSize = 2,
-    showPixelEquivalents = false,
-    rootFontSize = 16,
-  }: Partial<{
-    tabSize: number
-    showPixelEquivalents: boolean
-    rootFontSize: number
-  }> = {}
+    showPixelValues = false,
+  }: Partial<{ tabSize: number; showPixelValues: boolean }> = {}
 ): string {
   if (obj.__rule !== true && !Array.isArray(obj)) return null
 
   if (Array.isArray(obj)) {
     const rules = obj
-      .map((x) =>
-        stringifyCss(className, x, {
-          tabSize,
-          showPixelEquivalents,
-          rootFontSize,
-        })
-      )
+      .map((x) => stringifyCss(className, x, { tabSize, showPixelValues }))
       .filter(Boolean)
     if (rules.length === 0) return null
     return rules.join('\n\n')
@@ -60,7 +49,7 @@   const indentStr = indent.repeat(context.length)
   const decls = props.reduce((acc, curr, i) => {
     const propStr = ensureArray(obj[curr])
       .map((val) => {
-        const px = showPixelEquivalents ? remToPx(val, rootFontSize) : undefined
+        const px = showPixelValues ? remToPx(val) : undefined
         return `${indentStr + indent}${curr}: ${val}${px ? ` /*${px}*/` : ''};`
       })
       .join('\n')