diff --git a/crates/typst-html/src/rules.rs b/crates/typst-html/src/rules.rs
index d861249f5..3d215d56e 100644
--- a/crates/typst-html/src/rules.rs
+++ b/crates/typst-html/src/rules.rs
@@ -14,8 +14,8 @@ use typst_library::model::{
RefElem, StrongElem, TableCell, TableElem, TermsElem,
};
use typst_library::text::{
- HighlightElem, LinebreakElem, OverlineElem, RawElem, RawLine, SpaceElem, StrikeElem,
- SubElem, SuperElem, UnderlineElem,
+ HighlightElem, LinebreakElem, OverlineElem, RawElem, RawLine, SmallcapsElem,
+ SpaceElem, StrikeElem, SubElem, SuperElem, UnderlineElem,
};
use typst_library::visualize::ImageElem;
@@ -47,6 +47,7 @@ pub fn register(rules: &mut NativeRuleMap) {
rules.register(Html, OVERLINE_RULE);
rules.register(Html, STRIKE_RULE);
rules.register(Html, HIGHLIGHT_RULE);
+ rules.register(Html, SMALLCAPS_RULE);
rules.register(Html, RAW_RULE);
rules.register(Html, RAW_LINE_RULE);
@@ -390,6 +391,20 @@ const STRIKE_RULE: ShowFn =
const HIGHLIGHT_RULE: ShowFn =
|elem, _, _| Ok(HtmlElem::new(tag::mark).with_body(Some(elem.body.clone())).pack());
+const SMALLCAPS_RULE: ShowFn = |elem, _, styles| {
+ Ok(HtmlElem::new(tag::span)
+ .with_attr(
+ attr::style,
+ if elem.all.get(styles) {
+ "font-variant-caps: all-small-caps"
+ } else {
+ "font-variant-caps: small-caps"
+ },
+ )
+ .with_body(Some(elem.body.clone()))
+ .pack())
+};
+
const RAW_RULE: ShowFn = |elem, _, styles| {
let lines = elem.lines.as_deref().unwrap_or_default();
diff --git a/tests/ref/html/smallcaps-all.html b/tests/ref/html/smallcaps-all.html
new file mode 100644
index 000000000..47b799415
--- /dev/null
+++ b/tests/ref/html/smallcaps-all.html
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+ Test 012
Test 012
+
+
diff --git a/tests/suite/text/smallcaps.typ b/tests/suite/text/smallcaps.typ
index 981e41c4c..4b2f85aef 100644
--- a/tests/suite/text/smallcaps.typ
+++ b/tests/suite/text/smallcaps.typ
@@ -11,6 +11,6 @@
#show smallcaps: set text(fill: red)
#smallcaps[Smallcaps]
---- smallcaps-all ---
+--- smallcaps-all render html ---
#smallcaps(all: false)[Test 012] \
#smallcaps(all: true)[Test 012]