Makeup Demo

HEEx - Phoenix template language (HTML+EEx)

A lexer for HEEx (HTML + Embedded Elixir).

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>

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.

example.heex

<h1><%= expand_title(@title) %></h1>
<div id={"user_#{@user.id}"}>
  <%= @user.name %>
</div>
<%= render "child_template.html", assigns %>
<.show_name name={@user.name} />

<%= for user <- Repo.all(User) do %>
  <%= user.name %>
<% end %>