diff --git a/packages/shims-uni-app.d.ts b/packages/shims-uni-app.d.ts
index c21958795ed06002620c9382a25a7b1095612f2b..0168bc106b846455d53c60567a1bb9e6472faf31 100644
--- a/packages/shims-uni-app.d.ts
+++ b/packages/shims-uni-app.d.ts
@@ -34,6 +34,10 @@ declare namespace UniApp {
     globalStyle: {
       navigationBar: PageNavigationBar
       refreshOptions?: PageRefreshOptions
+      maxWidth?: number
+      rpxCalcMaxDeviceWidth?: number
+      rpxCalcBaseDeviceWidth?: number
+      // rpxCalcIncludeWidth?: number
     }
     topWindow?: LayoutWindowOptions
     leftWindow?: LayoutWindowOptions
diff --git a/packages/uni-api/src/service/base/upx2px.ts b/packages/uni-api/src/service/base/upx2px.ts
index 161c40f201bf6745628f319acfde4ef3e0de1586..a79e08e8fca6de13492946039b84fdfd09bbf142 100644
--- a/packages/uni-api/src/service/base/upx2px.ts
+++ b/packages/uni-api/src/service/base/upx2px.ts
@@ -19,6 +19,11 @@ function checkDeviceWidth() {
   isIOS = platform === 'ios'
 }
 
+function checkValue(value: unknown, defaultValue: number) {
+  const newValue = Number(value) as number
+  return isNaN(newValue) ? defaultValue : newValue
+}
+
 export const upx2px = defineSyncApi<API_TYPE_UPX2PX>(
   API_UPX2PX,
   (number, newDeviceWidth?: number) => {
@@ -34,7 +39,13 @@ export const upx2px = defineSyncApi<API_TYPE_UPX2PX>(
     if (number === 0) {
       return 0
     }
-    let result = (number / BASE_DEVICE_WIDTH) * (newDeviceWidth || deviceWidth)
+    const config = __uniConfig.globalStyle || {}
+    // ignore rpxCalcIncludeWidth
+    const maxWidth = checkValue(config.rpxCalcMaxDeviceWidth, 960)
+    const baseWidth = checkValue(config.rpxCalcBaseDeviceWidth, 375)
+    let width = newDeviceWidth || deviceWidth
+    width = width <= maxWidth ? width : baseWidth
+    let result = (number / BASE_DEVICE_WIDTH) * width
     if (result < 0) {
       result = -result
     }
diff --git a/packages/uni-core/src/view/plugin/index.ts b/packages/uni-core/src/view/plugin/index.ts
index a6b7f840b737125380ac8efb1b2c7b65d88fde59..c6003cacb6b02e00f3e704257f7cbfd25dea9568 100644
--- a/packages/uni-core/src/view/plugin/index.ts
+++ b/packages/uni-core/src/view/plugin/index.ts
@@ -3,11 +3,13 @@ import { App } from 'vue'
 import { initLongPress } from './longPress'
 import { initAppConfig } from './appConfig'
 import { initCustomDataset } from '@dcloudio/uni-shared'
+import { useRem } from './rem'
 
 export function initView(app: App) {
   if (__NODE_JS__) {
     return
   }
+  useRem()
   initCustomDataset()
   if (__UNI_FEATURE_LONGPRESS__) {
     initLongPress()
diff --git a/packages/uni-core/src/view/plugin/rem.ts b/packages/uni-core/src/view/plugin/rem.ts
new file mode 100644
index 0000000000000000000000000000000000000000..832020ee2cccf20568321480d90ad8a78a7ef4fb
--- /dev/null
+++ b/packages/uni-core/src/view/plugin/rem.ts
@@ -0,0 +1,38 @@
+function checkValue(value: unknown, defaultValue: number) {
+  const newValue = Number(value) as number
+  return isNaN(newValue) ? defaultValue : newValue
+}
+
+function getWindowWidth() {
+  const screenFix =
+    /^Apple/.test(navigator.vendor) && typeof window.orientation === 'number'
+  const landscape = screenFix && Math.abs(window.orientation as number) === 90
+  var screenWidth = screenFix
+    ? Math[landscape ? 'max' : 'min'](screen.width, screen.height)
+    : screen.width
+  var windowWidth =
+    Math.min(
+      window.innerWidth,
+      document.documentElement.clientWidth,
+      screenWidth
+    ) || screenWidth
+  return windowWidth
+}
+
+export function useRem() {
+  // TODO 与 upx2px 合并抽离逻辑到 shared，区分 service、view
+  function updateRem() {
+    const config = __uniConfig.globalStyle || {}
+    // ignore: rpxCalcIncludeWidth
+    const maxWidth = checkValue(config.rpxCalcMaxDeviceWidth, 960)
+    const baseWidth = checkValue(config.rpxCalcBaseDeviceWidth, 375)
+    let width = getWindowWidth()
+    width = width <= maxWidth ? width : baseWidth
+
+    document.documentElement.style.fontSize = width / 23.4375 + 'px'
+  }
+  updateRem()
+  document.addEventListener('DOMContentLoaded', updateRem)
+  window.addEventListener('load', updateRem)
+  window.addEventListener('resize', updateRem)
+}
diff --git a/packages/uni-h5/dist/uni-h5.es.js b/packages/uni-h5/dist/uni-h5.es.js
index 6b1fdaa7e3eabb273ab881ce52bbc5a116c5545a..5db11bcc3f5e4874c2d3cba9bb43dfb0b112fdce 100644
--- a/packages/uni-h5/dist/uni-h5.es.js
+++ b/packages/uni-h5/dist/uni-h5.es.js
@@ -967,7 +967,33 @@ function initAppConfig$1(appConfig) {
     globalProperties.$gcd = getComponentDescriptor;
   }
 }
+function checkValue$1(value, defaultValue) {
+  const newValue = Number(value);
+  return isNaN(newValue) ? defaultValue : newValue;
+}
+function getWindowWidth$1() {
+  const screenFix = /^Apple/.test(navigator.vendor) && typeof window.orientation === "number";
+  const landscape = screenFix && Math.abs(window.orientation) === 90;
+  var screenWidth = screenFix ? Math[landscape ? "max" : "min"](screen.width, screen.height) : screen.width;
+  var windowWidth = Math.min(window.innerWidth, document.documentElement.clientWidth, screenWidth) || screenWidth;
+  return windowWidth;
+}
+function useRem() {
+  function updateRem() {
+    const config = __uniConfig.globalStyle || {};
+    const maxWidth = checkValue$1(config.rpxCalcMaxDeviceWidth, 960);
+    const baseWidth = checkValue$1(config.rpxCalcBaseDeviceWidth, 375);
+    let width = getWindowWidth$1();
+    width = width <= maxWidth ? width : baseWidth;
+    document.documentElement.style.fontSize = width / 23.4375 + "px";
+  }
+  updateRem();
+  document.addEventListener("DOMContentLoaded", updateRem);
+  window.addEventListener("load", updateRem);
+  window.addEventListener("resize", updateRem);
+}
 function initView(app) {
+  useRem();
   initCustomDataset();
   if (__UNI_FEATURE_LONGPRESS__) {
     initLongPress();
@@ -9881,6 +9907,10 @@ function checkDeviceWidth() {
   deviceDPR = pixelRatio2;
   isIOS = platform === "ios";
 }
+function checkValue(value, defaultValue) {
+  const newValue = Number(value);
+  return isNaN(newValue) ? defaultValue : newValue;
+}
 const upx2px = /* @__PURE__ */ defineSyncApi(API_UPX2PX, (number, newDeviceWidth) => {
   if (deviceWidth === 0) {
     checkDeviceWidth();
@@ -9889,7 +9919,12 @@ const upx2px = /* @__PURE__ */ defineSyncApi(API_UPX2PX, (number, newDeviceWidth
   if (number === 0) {
     return 0;
   }
-  let result = number / BASE_DEVICE_WIDTH * (newDeviceWidth || deviceWidth);
+  const config = __uniConfig.globalStyle || {};
+  const maxWidth = checkValue(config.rpxCalcMaxDeviceWidth, 960);
+  const baseWidth = checkValue(config.rpxCalcBaseDeviceWidth, 375);
+  let width = newDeviceWidth || deviceWidth;
+  width = width <= maxWidth ? width : baseWidth;
+  let result = number / BASE_DEVICE_WIDTH * width;
   if (result < 0) {
     result = -result;
   }
diff --git a/packages/uni-h5/style/framework/base.css b/packages/uni-h5/style/framework/base.css
index c3b7dca825460910e4a7c62b63ec1c185e7134cb..857b23971ba2f46419dd928e0d9b36acb05ae7aa 100644
--- a/packages/uni-h5/style/framework/base.css
+++ b/packages/uni-h5/style/framework/base.css
@@ -13,6 +13,7 @@ body {
 
 body {
   overflow-x: hidden;
+  font-size: 16px;
 }
 
 uni-app,
diff --git a/packages/uni-shared/dist/uni-shared.cjs.js b/packages/uni-shared/dist/uni-shared.cjs.js
index 961a37c72536f2909352137006ec0bfcf931d84f..35f426dc5e56c12ca61a2f3823fd20fe7b217590 100644
--- a/packages/uni-shared/dist/uni-shared.cjs.js
+++ b/packages/uni-shared/dist/uni-shared.cjs.js
@@ -44,6 +44,7 @@ const defaultRpx2Unit = {
     unitPrecision: 5,
 };
 function createRpx2Unit(unit, unitRatio, unitPrecision) {
+    // ignore: rpxCalcIncludeWidth
     return (val) => val.replace(unitRE, (m, $1) => {
         if (!$1) {
             return m;
diff --git a/packages/uni-shared/dist/uni-shared.es.js b/packages/uni-shared/dist/uni-shared.es.js
index 3227e9d219f7164ae39013dea30a650e469d2064..de524b408a7fc292aef201d6c407e66e1872bf18 100644
--- a/packages/uni-shared/dist/uni-shared.es.js
+++ b/packages/uni-shared/dist/uni-shared.es.js
@@ -40,6 +40,7 @@ const defaultRpx2Unit = {
     unitPrecision: 5,
 };
 function createRpx2Unit(unit, unitRatio, unitPrecision) {
+    // ignore: rpxCalcIncludeWidth
     return (val) => val.replace(unitRE, (m, $1) => {
         if (!$1) {
             return m;
diff --git a/packages/uni-shared/src/dom/style.ts b/packages/uni-shared/src/dom/style.ts
index 222e40d381664ed5735725c529c8d5916fdb2748..e223c09fcce3ff95045a97a5b66082ae44baa725 100644
--- a/packages/uni-shared/src/dom/style.ts
+++ b/packages/uni-shared/src/dom/style.ts
@@ -22,6 +22,7 @@ export function createRpx2Unit(
   unitRatio: number,
   unitPrecision: number
 ) {
+  // ignore: rpxCalcIncludeWidth
   return (val: string) =>
     val.replace(unitRE, (m, $1) => {
       if (!$1) {