This section explains what rich text tags are and how you can use them to format and customise text on GeoAR.it hotspots.
🔤 Rich Text Tags Overview
- 📝 Rich text tags let you alter the appearance and layout of hotspot text—similar to HTML/XML, but more relaxed.
- 🔗 Tags look like
<tag>. Many have scopes (</tag>) and can be nested. - ⚙️ Some tags accept values and attributes, e.g.
<tag=value>or<tag attribute=value>. Numbers, pixels, %, em, and hex codes are supported. - 📏 Tags with attributes are limited to 128 characters each (plenty for almost any use).
This section provides a quick reference to the supported tags.
🔑 Tag Reference Table
| Tag | Summary |
|---|---|
align |
Text alignment. |
alpha, color |
Colour and opacity. |
b, i |
Bold and italic style. |
cspace |
Character spacing. |
font |
Font and material selection. |
indent |
Indentation. |
line-height |
Line height. |
line-indent |
Line indentation. |
link |
Text metadata (user interaction). |
lowercase, uppercase, smallcaps |
Capitalisation. |
margin |
Text margins. |
mark |
Highlight text. |
mspace |
Monospacing. |
noparse |
Don’t parse tags inside. |
nobr |
Non-breaking spaces. |
page |
Page break. |
pos |
Horizontal caret position. |
size |
Font size. |
space |
Horizontal space. |
sprite |
Insert sprites/images. |
s, u |
Strikethrough and underline. |
style |
Custom styles. |
sub, sup |
Subscript and superscript. |
voffset |
Baseline offset. |
width |
Text width. |
This section covers alignment, colour, and opacity tags with examples.
🔡 Alignment & 🎨 Colour
- 📏
<align="right">(or "center"/"left") to align text in that scope. - 🎨
<color="red">,<color=#005500>,<#0000FF>(hex colours allowed). - 💧
<alpha=#CC>changes text opacity (hex 00–FF).
<align="right">Right aligned
<color="red">Red <color=#005500>Dark Green <#0000FF>Blue
<alpha=#88>Semitransparent
This section shows how to use bold, italic, and character spacing tags.
🔲 Bold, Italic & ⏳ Character Spacing
<b>bold,<i>italic,</b>,</i>to end scope.<cspace=1em>Text</cspace>for extra letter spacing.
The <i>quick brown fox</i> jumps over the <b>lazy dog</b>.
<cspace=1em>Spacing</cspace>
This section covers font switching, indentation, and line height controls.
🖋️ Font, Indent & Line Height
- 🖋️
<font="Impact SDF">Impact font</font>(or swap material withmaterial="..."). - ↔️
<indent=15%>Indented text</indent>. - ⏫
<line-height=150%>More space between lines</line-height>.
Would you like <font="Impact SDF">a different font?</font>
1. <indent=15%>Bullet point</indent>
Line height at 100%
<line-height=150%>Tall lines
This section shows how to use advanced tags like links, case, marking, monospace, and more.
🔗 Links, Case, Marking & More
- 🔗
<link="ID">my link</link>for clickable metadata (not visually styled by default). - 🔠
<lowercase>...,<uppercase>...,<smallcaps>...for case control. - 📍
<mark=#ffff00aa>highlight</mark>for a translucent overlay. - 🖤
<mspace=2.75em>monospace</mspace>to force all characters same width. - 🚫
<noparse>disables parsing within scope. - ⛔
<nobr>Keep together</nobr>disables word-wrap. - 📄
<page>for a page break (in page overflow mode).
<link="help">Tap for help</link>
<lowercase>LOWERCASE</lowercase>
<mark=#ffff00aa>highlight</mark>
<noparse><b></noparse> shows tags literally.
This section covers font size, space, sprites, and more.
🔠 Size, Space, Sprites & Advanced
- 🔠
<size=100%>Normal</size>,<size=80%>Smaller</size> - ⬛
<space=5em>adds horizontal space. - 🖼️
<sprite=1>or<sprite name="icon">to insert images/icons (sprite atlases). - ✏️ Use
style,sub,sup,voffset, andwidthfor custom effects and advanced layout.
<size=100%>Echo <size=80%>Echo <size=60%>Echo
Give me some <space=5em> space.
<sprite=1> for icons