ChimeraCSS


Welcome to the ChimeraCSS demo page! You can use this page to discover the different themes and styles that chimera has to offer. When contributing to the project, you can use this page to test your changes.

NOTE: This page is just a demo, and will not contain any framework documentation. For documentation, please visit the github repository Github repository or the NPM page.

Change Theme

Click on one of the links below to change the theme of this page. The only thing that will change is the stylesheet, so you can see how the different themes look. It is also possble to create your own theme, and use it on this page, or on your own website. Here is a guide on how chimera works as well as how to create your own themes.


Typography

h1 small h1

h2 small h2

h3 small h3

h4 small h4

h5 small h5
h6 small h6

Forms

Forms is a really important aspect of html. We offer accesible yet and good looking forms with support for :focus css-selectors which allows for great keyboard navigation.




















Code and formatted text

Below is some code, you can copy it with Ctrl-C. Did you know, alert(1) can show an alert in JavaScript!

function changeStylesheet(cssFile) {
        document.getElementById("stylesheet").href = cssFile;
      }

Tables

Tables are a great way to display data which is why chimera provides you with beautiful table styles. Below is an example of a table with some data.

Firstname Lastname Age
John Doe 30
Jane Doe 25
Johnny Doe 15

Inline formatted text

You can use many different elements to format your text. You can make your text small or you can make it strong or bold. You can also make it emphasized or striked. You can also make it deleted or simple striked. You can also make it inserted or subscripted or superscripted. You can also make it cited or quoted. You can also make it defined as well as italic underline Highlighting abbreviation and lastly

addressed

Unimplemented elements

There are some elements that are not implemented yet, but will be in the future. This section can be very useful for testing when contributing to chimera! At the same time this means that the demo of the implemented framework is finished and you can stop reading if you want.


bdi bdo

Hello, world!
ยด
Personalia: Name:
Email:
Date of birth:
2048
Click me to see more

Here is some more text

Hello world

Hi coder