Makeup Demo

Makeup Demo

HTML Language¶

A lexer for HTML.

This page shows examples of source files lexed by the same lexer, but rendered into HTML using different styles.

Some styles are richer than others in that they define more different token categories. Examples of such richer styles are the Default style, the Tango style and the Colorful style.

In all cases the lexer is the same, and the only difference is the colors defined by the styles.

Abap Style (abap)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.abap_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Algol Style (algol)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.algol_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Algol_Nu Style (algol_nu)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.algol_nu_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Arduino Style (arduino)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.arduino_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Autumn Style (autumn)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.autumn_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Borland Style (borland)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.borland_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

BlackWhite Style (bw)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.bw_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Colorful Style (colorful)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.colorful_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Default Style (default)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.default_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Emacs Style (emacs)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.emacs_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Friendly Style (friendly)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.friendly_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Fruity Style (fruity)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.fruity_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Igor Style (igor)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.igor_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Lovelace Style (lovelace)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.lovelace_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Manni Style (manni)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.manni_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Monokai Style (monokai)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.monokai_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Murphy Style (murphy)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.murphy_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Native Style (native)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.native_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

ParaisoDark Style (paraiso_dark)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.paraiso_dark_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

ParaisoLight Style (paraiso_light)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.paraiso_light_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Pastie Style (pastie)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.pastie_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Perldoc Style (perldoc)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.perldoc_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

RainbowDash Style (rainbow_dash)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.rainbow_dash_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Rrt Style (rrt)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.rrt_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Tango Style (tango)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.tango_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Trac Style (trac)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.trac_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Vim Style (vim)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.vim_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

VisualStudio Style (vs)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.vs_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>

Xcode Style (xcode)¶

You can access this style as:

Makeup.Styles.HTML.StyleMap.xcode_style()

And invoke Makeup.stylesheet(style) to generate the appropriate stylesheets for you.

small.html¶

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <h1 class="header">This is a Heading</h1>

  <h2 class="header">This is a Subheading</h2>

  <p>
    This <em>is</em> a paragraph.
    It contains <strong>several</strong> sentences</p>

</body>

</html>