Search code examples
csslatexxelatex

Is there CSS for typesetting the XeLaTeX logo in HTML?


I want to use the XeLaTeX logo in HTML pages. I found the answer to a similar question regarding the LaTeX logo here: Is there CSS for typesetting the LaTeX logo in HTML?, but the XeLaTeX logo involves a mirrored E. Is there a trick to get this too?


Solution

  • You could use “Ǝ” U+018E LATIN CAPITAL LETTER REVERSED E to get a mirrored E, but it’s tricky and risky to do a character substitution with CSS.

    So a better approach would be to uppercase the “e” and use a 3D transform. Considering just this part, the following code would work on sufficiently modern browsers:

    <style>
    .revcap {
    display: inline-block;
    text-transform: uppercase;
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
    }
    </style>
    X<span class=revcap>e</span>LaTeX