diff --git a/config.toml b/config.toml
index c164d1f9e..6520e01bc 100644
--- a/config.toml
+++ b/config.toml
@@ -4,6 +4,7 @@ extended = true
min = "0.128.0"
[params]
+sass_transpiler = "libsass" # dartsass is recommended, since libsass is deprecated.
breadcrumb = true
dateFormat = ":date_long"
countTaxonomyPosts = false
diff --git a/exampleSite/content/docs/configuration/site-params/index.md b/exampleSite/content/docs/configuration/site-params/index.md
index 039f2154e..1d1eb220a 100644
--- a/exampleSite/content/docs/configuration/site-params/index.md
+++ b/exampleSite/content/docs/configuration/site-params/index.md
@@ -25,6 +25,7 @@ The site parameters are located in `config/_default/params.toml` by default.
| Name | Type | Default | Description
|---|:-:|:-:|---
+| `sass_transpiler` | string | `libsass` | `dartsass` is recommended, since `libsass` is deprecated.
| **Page**
| `mainSections` | Array | `["posts"]` | Main sections
| `titleCase` | Boolean | `false` | Capitalized title or not
diff --git a/exampleSite/content/docs/configuration/site-params/index.zh-hans.md b/exampleSite/content/docs/configuration/site-params/index.zh-hans.md
index f02b16c39..93a68c0a2 100644
--- a/exampleSite/content/docs/configuration/site-params/index.zh-hans.md
+++ b/exampleSite/content/docs/configuration/site-params/index.zh-hans.md
@@ -25,6 +25,7 @@ authors = ["RazonYang"]
| 名称 | 类型 | 默认值 | 说明
|---|:-:|:-:|---
+| `sass_transpiler` | string | `libsass` | 推荐使用 `dartsass`,因为 `libsass` 已被弃用。
| **Page**
| `mainSections` | Array | `["posts"]` | 主要的 sections
| `titleCase` | Boolean | `false` | 标题首字母是否大写
diff --git a/exampleSite/content/docs/configuration/site-params/index.zh-hant.md b/exampleSite/content/docs/configuration/site-params/index.zh-hant.md
index f426f0b79..214185504 100644
--- a/exampleSite/content/docs/configuration/site-params/index.zh-hant.md
+++ b/exampleSite/content/docs/configuration/site-params/index.zh-hant.md
@@ -25,6 +25,7 @@ authors = ["RazonYang"]
| 名稱 | 類型 | 默認值 | 說明
|---|:-:|:-:|---
+| `sass_transpiler` | string | `libsass` | 推薦使用 `dartsass`,因為 `libsass` 已被棄用。
| **Page**
| `mainSections` | Array | `["posts"]` | 主要的 sections
| `titleCase` | Boolean | `false` | 標題首字母是否大寫
diff --git a/layouts/partials/assets/algolia/css.html b/layouts/partials/assets/algolia/css.html
index f0f74b145..cff389a87 100644
--- a/layouts/partials/assets/algolia/css.html
+++ b/layouts/partials/assets/algolia/css.html
@@ -2,6 +2,7 @@
{{- $outputStyle := "expanded" }}
{{- if hugo.IsProduction }}{{ $outputStyle = "compressed" }}{{ end }}
{{- $options := dict
+ "transpiler" (default "libsass" site.Params.sass_transpiler)
"targetPath" "assets/algolia/bundle.min.css"
"outputStyle" $outputStyle
"includePaths" (slice "node_modules")
diff --git a/layouts/partials/assets/docsearch/css.html b/layouts/partials/assets/docsearch/css.html
index 7653f9aec..4b1ea1dd1 100644
--- a/layouts/partials/assets/docsearch/css.html
+++ b/layouts/partials/assets/docsearch/css.html
@@ -2,7 +2,12 @@
{{- with .Site.Params.docsearch }}
{{- $outputStyle := "expanded" }}
{{- if hugo.IsProduction }}{{ $outputStyle = "compressed" }}{{ end }}
- {{- $options := dict "targetPath" "assets/docsearch/bundle.min.css" "outputStyle" $outputStyle "includePaths" (slice "node_modules") }}
+ {{- $options := dict
+ "transpiler" (default "libsass" site.Params.sass_transpiler)
+ "targetPath" "assets/docsearch/bundle.min.css"
+ "outputStyle" $outputStyle
+ "includePaths" (slice "node_modules")
+ }}
{{- $config := resources.Get "main/scss/_config.scss" | resources.ExecuteAsTemplate "docsearch/scss/_config.scss" . }}
{{- $main := resources.Get "docsearch/scss/index.scss" }}
{{- $style := slice $config $main | resources.Concat "docsearch/scss/main.scss" | toCSS $options | fingerprint }}
diff --git a/layouts/partials/assets/katex/css.html b/layouts/partials/assets/katex/css.html
index d95e96cba..1b2c8446b 100644
--- a/layouts/partials/assets/katex/css.html
+++ b/layouts/partials/assets/katex/css.html
@@ -1,5 +1,10 @@
{{- $outputStyle := "expanded" }}
{{- if hugo.IsProduction }}{{ $outputStyle = "compressed" }}{{ end }}
-{{- $options := dict "targetPath" "assets/katex/bundle.min.css" "outputStyle" $outputStyle "includePaths" (slice "node_modules") }}
+{{- $options := dict
+ "transpiler" (default "libsass" site.Params.sass_transpiler)
+ "targetPath" "assets/katex/bundle.min.css"
+ "outputStyle" $outputStyle
+ "includePaths" (slice "node_modules")
+}}
{{- $style := resources.Get "katex/scss/index.scss" | toCSS $options | fingerprint }}
diff --git a/layouts/partials/assets/main/css-rtl.html b/layouts/partials/assets/main/css-rtl.html
index 95d5bc4a8..c07e324e7 100644
--- a/layouts/partials/assets/main/css-rtl.html
+++ b/layouts/partials/assets/main/css-rtl.html
@@ -1,7 +1,12 @@
{{- $postCSSOptions := (dict "config" "assets/main/config/rtl") }}
{{- $outputStyle := "expanded" }}
{{- if hugo.IsProduction }}{{ $outputStyle = "compressed" }}{{ end }}
-{{- $options := dict "targetPath" "assets/main/bundle.rtl.min.css" "outputStyle" $outputStyle "includePaths" (slice "node_modules") }}
+{{- $options := dict
+ "transpiler" (default "libsass" site.Params.sass_transpiler)
+ "targetPath" "assets/main/bundle.rtl.min.css"
+ "outputStyle" $outputStyle
+ "includePaths" (slice "node_modules")
+}}
{{- $config := resources.Get "main/scss/_config.scss" | resources.ExecuteAsTemplate "main/scss/_config.rtl.scss" . }}
{{- $main := resources.Get "main/scss/index.scss" }}
{{- $style := slice $config $main | resources.Concat "main/scss/main.rtl.css" | toCSS $options | css.PostCSS $postCSSOptions | fingerprint }}
diff --git a/layouts/partials/assets/main/css.html b/layouts/partials/assets/main/css.html
index 206db6874..923a79c22 100644
--- a/layouts/partials/assets/main/css.html
+++ b/layouts/partials/assets/main/css.html
@@ -1,7 +1,12 @@
{{- $postCSSOptions := dict "config" "postcss.config.js" }}
{{- $outputStyle := "expanded" }}
{{- if hugo.IsProduction }}{{ $outputStyle = "compressed" }}{{ end }}
-{{- $options := dict "targetPath" "assets/main/bundle.min.css" "outputStyle" $outputStyle "includePaths" (slice "node_modules") }}
+{{- $options := dict
+ "transpiler" (default "libsass" site.Params.sass_transpiler)
+ "targetPath" "assets/main/bundle.min.css"
+ "outputStyle" $outputStyle
+ "includePaths" (slice "node_modules")
+}}
{{- $config := resources.Get "main/scss/_config.scss" | resources.ExecuteAsTemplate "main/scss/_config.scss" . }}
{{- $main := resources.Get "main/scss/index.scss" }}
{{- $styles := slice $config $main }}
diff --git a/layouts/partials/assets/viewer/css.html b/layouts/partials/assets/viewer/css.html
index 3a286fb5c..28994c32e 100644
--- a/layouts/partials/assets/viewer/css.html
+++ b/layouts/partials/assets/viewer/css.html
@@ -1,7 +1,12 @@
{{- if .Site.Params.viewer }}
{{- $outputStyle := "expanded" }}
{{- if hugo.IsProduction }}{{ $outputStyle = "compressed" }}{{ end }}
- {{- $options := dict "targetPath" "assets/viewer/bundle.min.css" "outputStyle" $outputStyle "includePaths" (slice "node_modules") }}
+ {{- $options := dict
+ "transpiler" (default "libsass" site.Params.sass_transpiler)
+ "targetPath" "assets/viewer/bundle.min.css"
+ "outputStyle" $outputStyle
+ "includePaths" (slice "node_modules")
+ }}
{{- $style := resources.Get "viewer/scss/index.scss" | toCSS $options | fingerprint }}
{{- end -}}