Welcome to Classless CSS Demo using "Tufte.css"

I was struggling to make a simple page I was building look decent. I knew there were stylesheets that just used 'semantic html' (like Tufte) and didn't require any special class names (i.e <button class="btn-primary">a button</button>), however I was struggling to find them.

So I asked Twitter:

I should know this, but I'm looking for a simple CSS stylesheet that would replace the default user agent and make it look half decent. Google-fu is failing me, all I can find is resets and full frameworks. :\

Once I found examples of 'class-less CSS', it was then a bit of a pain to find them and compare all the different examples. Hence this page.

This page is designed to collate all the CSS frameworks into one place and let you compare and contrast them.

Here is the list of class-less CSS frameworks that you can checkout:

If you have a framework you would like include, create PR against frameworks.ts

Check out my other site.


This page is rendered using Tufte.css.

Some of the entries are taken from the layout from stylize.

Typography:

This is a H1 heading

This is a H2 heading

This is a H3 heading

This is a H4 heading

This is a H5 heading
This is a H6 heading

This is a paragraph of text. It's my paragraph. I like it a lot.


This is a Strong / Bold text
This is an Emphasized / Italic text
This is a Marked / Highlighted text
This is a Small text
This is a Deleted text
This is a Underlined / Inserted text
This is a Subscript text
This is a Superscript text
This is a preformatted text.
This is a Blockquote.
This is a sample output.
This is the <code> & kbd

Links & navigation:



Normal link

Lists:

  1. Ordered list item 1
  2. Ordered list item 2
    1. Ordered list item 3
  3. Ordered list item 4
  4. Ordered list item 5
Banana
A yellow fruit that is easy to peel.
Which also grows on a tree.
Cashew
A tan nut without a peel.
Cherry
A red fruit that is hard to peel.

Form:

This is a legend on fieldset








Anchor role=button

Table:

# Name Username Location
1 Vasanth @vsnthv Chennai, India
2 John @john USA
3 Chan @chan Hong Kong

Table with border=1

# Name Username Location
1 Vasanth @vsnthv Chennai, India
2 John @john USA
3 Chan @chan Hong Kong

Images

placeholder image 900 pixels wide by 500 pixels tall
A photo placeholder text