Markup
In addition to the visible letters that you now know, Musa also has markup: codes hidden in the text that control the display of the Musa letters. For example, they may control the gait, the style (bold, italic, ...), the relative size, and so forth. To see whether your browser extension is correctly rendering Musa Markup, visit the Markup Test page.
The world is full of markup languages, most of them much more powerful than Musa's. Musa markup is limited to just a few tags, all expressed as single codepoints in the range E300-E3FF. These tags can't have attributes, so they're even more limited. But they're powerful enough for most meanings, if not for every possible decoration.
Those other markup languages have also evolved to use semantic markup (also known as logical or conceptual markup). Using semantic markup, you might label a quotation as <cite>. But Musa's markup is presentational: it just describes the appearance of the text, for instance labeling it <b> for bold or <i> for italic.
One other interesting difference: SGML languages have specific closing tags for each opening tag. For example, every <div> tag must be closed with a </div> tag. But this conceals a big limitation: only the most recent tag can be closed! The hierarchy of tags forms a LIFO stack; the tags can't overlap. So Musa uses only one closing tag, which closes the last opening tag applied.
The Composer enables you to add markup to Musa text.
Musa Markup Codes
| Class | Code | Plaintext Tag | Sample | HTML equivalent | Eminem |
|---|---|---|---|---|---|
| Styles E30x | E300 | </> | Closes last tag | </span> | |
| E301 | <bold> | Bold | <span style="font-weight: bold;"> | | |
| E302 | <italic> | Italic | <span style="font-style: italic;"> | | |
| E308 | <under> | Underline | <span style="text-decoration: underline;"> | | |
| E309 | <over> | Overline | <span style="text-decoration: overline;"> | | |
| E30A | <through> | Strikethrough | <span style="text-decoration: line-through;"> | | |
| Layout E31x | E310 | <comment> | Comment | <span style="display: none;"> | |
| E311 | <line> | Alone on Line | <span style="display: block;"> | | |
| E312 | <indent> | Indented | <span style="margin-left: 5%;"> | | |
| E313 | <header> | Header | <span style="display: block; font-size: 141%; line-height: 150%; margin-top: 1rem;"> | | |
| E314 | <title> | Title | <span style="display: block; text-align: center; font-size: 200%; line-height: 150%; margin-top: 1rem;"> | | |
| E315 | <paragraph> | Paragraph | <span style="display: block; margin-top: 1rem;"> | | |
| E316 | <superscript> | TextSuperscript | <span style="vertical-align: super; font-size: 50%;"> | | |
| E317 | <subscript> | TextSubscript | <span style="vertical-align: sub; font-size: 50%;"> | | |
| Alignment E32x (canvas) | E320 | <left> | Left | <span style="text-align: left;"> | |
| E321 | <center> | Center | <span style="text-align: center;"> | | |
| E322 | <right> | Right | <span style="text-align: right;"> | | |
| E323 | <top> | Top | <span style="display: table-cell; vertical-align: top;"> | | |
| E324 | <middle> | Middle | <span style="display: table-cell; vertical-align: middle;"> | | |
| E325 | <bottom> | Bottom | <span style="display: table-cell; vertical-align: bottom;"> | | |
| Size E33x | E330 | <large> | Large √2x ≈ 141%; | <span style="font-size: 141%; vertical-align: -10%;"> | |
| E331 | <double> | Double 2x = 200%; | <span style="font-size: 200%; vertical-align: -15%;"> | | |
| E332 | <triple> | Triple 2√2x ≈ 283%; | <span style="font-size: 283%; vertical-align: -20%;"> | | |
| E333 | <quad> | Quad 4x = 400%; | <span style="font-size: 400%; vertical-align: -25%;"> | | |
| E338 | <small> | Small 1/√2x ≈ 71%; | <span style="font-size: 71%; vertical-align: 15%;"> | | |
| E339 | <half> | Half 1/2x = 50%; | <span style="font-size: 50%; vertical-align: 30%;"> | | |
| E33A | <third> | Third 1/2√2x ≈ 36%; | <span style="font-size: 36%; vertical-align: 60%;"> | | |
| E33B | <quarter> | Quarter 1/4x = 25%; | <span style="font-size: 25%; vertical-align: 90%;"> | | |
| Background Color E34x | E340 | <clear> | Clear Background | <span style="background-color: transparent;"> | |
| E341 | <white> | White Background | <span style="background-color: rgb(255, 255, 255);"> | | |
| E342 | <pink> | Rose Background | <span style="background-color: rgb(255, 128, 128);"> | | |
| E343 | <yellow> | Yellow Background | <span style="background-color: rgb(255, 255, 128);"> | | |
| E344 | <lime> | Lime Background | <span style="background-color: rgb(128, 255, 128);"> | | |
| E345 | <cyan> | Cyan Background | <span style="background-color: rgb(128, 255, 255);"> | | |
| E346 | <azure> | Azure Background | <span style="background-color: rgb(128, 128, 255);"> | | |
| E347 | <magenta> | Magenta Background | <span style="background-color: rgb(255, 128, 255);"> | | |
| E348 | <gray> | Gray Background | <span style="background-color: rgb(128, 128, 128);"> | | |
| E349 | <red> | Cherry Background | <span style="background-color: rgb(128, 0, 0);"> | | |
| E34A | <olive> | Olive Background | <span style="background-color: rgb(128, 128, 0);"> | | |
| E34B | <emerald> | Emerald Background | <span style="background-color: rgb(0, 128, 0);"> | | |
| E34C | <teal> | Teal Background | <span style="background-color: rgb(0, 128, 128);"> | | |
| E34D | <blue> | Navy Background | <span style="background-color: rgb(0, 0, 128);"> | | |
| E34E | <purple> | Purple Background | <span style="background-color: rgb(128, 0, 128);"> | | |
| E34F | <black> | Black Background | <span style="background-color: rgb(0, 0, 0);"> | | |
| Text Color E35x | E350 | <blacktext> | Black Text | <span style="color: rgb(0, 0, 0);"> | |
| E351 | <redtext> | Cherry Text | <span style="color: rgb(128, 0, 0);"> | | |
| E352 | <emeraldtext> | Emerald Text | <span style="color: rgb(0, 128, 0);"> | | |
| E353 | <bluetext> | Navy Text | <span style="color: rgb(0, 0, 128);"> | | |
| E354 | <graytext> | Gray Text | <span style="color: rgb(128, 128, 128);"> | | |
| E355 | <yellowtext> | Yellow Text | <span style="color: rgb(255, 255, 128);"> | | |
| E356 | <cyantext> | Cyan Text | <span style="color: rgb(128, 255, 255);"> | | |
| E357 | <magentatext> | Magenta Text | <span style="color: rgb(255, 128, 255);"> | | |
| E358 | <whitetext> | White Text | <span style="color: rgb(255, 255, 255);"> | | |
| Adjuvant Fonts E38x | E380 | <subtitle> | | <span style="font-family: 'Subtitle Musa Ruby';"> | |
| E381 | <tomokana> | | <span style="font-family: 'Tomokana Musa Ruby';"> | | |
| E382 | <roman> | Roman | <span style="font-family: 'Roman Musa Trans';"> | | |
| E383 | <ripe> | ˈɹajp | <span style="font-family: 'Ripe Musa Trans';"> | | |
| E384 | <numeric> | Numeric | <span style="font-family: 'Numeric Musa Trans';"> | | |
| E385 | <pygmalion> | Pygmalıon | <span style="font-family: 'Pygmalion Musa Diacritic';"> | | |
| E386 | <galatea> | Galatea | <span style="font-family: 'Galatea Musa Diacritic';"> | | |
| E387 | <eminem> | Eminem | <span style="font-family: 'Eminem Musa Markup';"> | | |
| E388 | <hentrax> | | <span style="font-family: 'Hentrax Musa Element';"> | | |
| E389 | <tartaglia> | (not ready yet) | <span style="font-family: 'Tartaglia Musa Formula';"> | | |
| E38A | <overripe> | | <span style="font-family: 'Overripe Musa Ruby';"> | | |
| E38B | <unripe> | ˈʌn.ɹajp | <span style="font-family: 'Unripe Musa Trans';"> | | |
| E38C | <underripe> | ˈʌndɚ.ɹajp | <span style="font-family: 'Underripe Musa Ruby';"> | | |
| E38D | <heritage> | | <span style="font-family: 'Heritage Musa Trans';"> | | |
| E38E | <hermitage> | | <span style="font-family: 'Hermitage Musa Ruby';"> | | |
| Text Fonts E3Ax | E3A0 | <dushan> | | <span style="font-family: 'Dushan Musa Alphabet';"> | |
| E3A1 | <kraljevo> | | <span style="font-family: 'Kraljevo Musa Alphabet';"> | | |
| E3A2 | <taunus> | | <span style="font-family: 'Taunus Musa Ligature';"> | | |
| E3A3 | <yousuf> | | <span style="font-family: 'Yousuf Musa Ligature';"> | | |
| E3A4 | <tharbis> | | <span style="font-family: 'Tharbis Musa Abugida';"> | | |
| E3A5 | <njoya> | | <span style="font-family: 'Njoya Musa Syllabary';"> | | |
| E3A6 | <ramanujan> | | <span style="font-family: 'Ramanujan Musa Akshara';"> | | |
| E3A7 | <zhouhei> | | <span style="font-family: 'Zhouhei Musa Fangzi';"> | | |
| E3A8 | <yasuhiro> | | <span style="font-family: 'Yasuhiro Musa Kana';"> | | |
| E3A9 | <penflower> | (not ready yet) | <span style="font-family: 'Penflower Musa Cursive';"> | | |
| E3AA | <averroes> | | <span style="font-family: 'Averroes Musa Abjad';"> | | |
| E3AB | <kunming> | | <span style="font-family: 'Kunming Musa Fangzi';"> | | |
| E3AC | <wangkai> | | <span style="font-family: 'Wangkai Musa Fangzi';"> | |
Common Closing Tag: Not only is this easier to use, but it has a hidden advantage. If, by mistake, you overlap two HTML tags, for example entering A<u>B<i>C</u>D</i>E, it's an HTML syntax error (although many browsers will correct it : ABCDE). But using a common closing tag corrects it automatically: each closing tag closes the last tag.
Size Tags: The factor separating each size is √2, about 141%. A smaller ratio is hard to distinguish; a larger one isn't fine enough. All sizes share the same midline (not baseline).
The Eminem Font
Usually, Musa markup is visible through its effects: bold text is bold, large text is large, and so on. But sometimes, you want to see the markup explicitly. For that, we offer the Eminem font, which covers the codepoints that markup uses in the range E300-E3FF. Each codepoint is represented by a two-wide glyph with a bracket on the right, empty space on the left, and an abbreviated plaintext tag in the center, written vertically. The closing tag is only one-wide, has the space on the right, and the bracket on the left. The spaces help the tag stand out, and the vertical text won't be confused with normal Musa text. Here's a sample:
Here's a page where you can test to make sure your Musa Markup is being displayed correctly:
| Markup Test page |
| < Digital Musa | Keyboard > |
| © 2002-2024 The Musa Academy | musa@musa.bet | 03nov23 |