Markup Generator

v. 1.04


Markup Generator is a simple tool created for xhtml/css coders that are tired of writing boring frame code at the very beginning of slicing work. It's main purpose is to speed up your work by generating xhtml markup and a css frame out of very intuitive, shortened syntax so you can jump directly to the elements styling.



Extra code:

Generate CSS:

Extra code

Content of these fields will be saved to cookies upon submit, so you don't have to worry about them next time. Of course if you erase your cookies all data will be lost. Also note that one cookie can contain about 4k of data, so don't put too much code here.


This tool uses enhanced, line-by-line, css-a-like syntax with space indent to generate xhtml markup. You can add tag, ids, classes, a bit of content (at the end after = char) and an additional code (between [ and ]).


=<tag id="id" class="class class" additional>content</tag>


h1#logo.summer=Company Name is:
<h1 id="logo" class="summer">Company Name</h1>

input[type="text" name="term"]#query is:
<input id="query" type="text" name="term" /> is:
<div id="root" class="company"></div>

p.vcard.highlight=Lorem ipsum is:
<p class="vcard highlight">Lorem ipsum</p>

Set hierarchy with spaces. Note that some tags have default additional data eg. for <a> this is href="./" (inserted only if [additional] isn't set).

For the first time use insert sample data and see how it works.