Markdown to HTML Converter

The Markdown to HTML Converter is a lightweight, easy-to-use NPM package that allows you to convert Markdown files or strings into HTML. It is perfect for developers looking to integrate Markdown parsing into their web applications, static site generators, or any other project that requires converting Markdown content to HTML.

``
import plaintohtml from "markdown-to-htm"

let plain = "# hello ho are you"
const htmlis = plaintohtml(plain)

console.log(htmlis);
`
output:

hello ho are you



add this .css file

you can also update styles for your choice and also add media query for different screen sizes

`
index.css
* {
appearance: none;
}

.h1 {
font-size: 35px;
font-weight: 600;
letter-spacing: 2px;
}

.h2 {
font-size: 30px;
font-weight: 600;
}

.h3 {
font-size: 20px;
font-weight: 600;
}

.a {
color: rgb(204, 255, 238);
text-wrap:wrap;
}

ul li {
list-style-type: square;
margin-left: 2rem;
line-height: 2rem;
}

ol li {
margin-left: 2rem;
list-style-type: decimal;
}

hr {
margin: 1rem 0;
border-top-width: 1px;
border-top-color: rgb(230, 254, 255);
}

.blok {
padding-left: 1rem;
margin-left: 1rem;
border-left: 4px solid white;
height: fit-content;
}

.pre {
margin: 0.5rem auto;
width: 95%;
color: white;
padding: 0.5rem;
background-color: rgba(41, 41, 41, 0.477);
font-size: 0.8rem;
border-radius: 0.5rem;
display: block;

}
.inline {
width: 95%;
color: white;
padding: 0.3rem 0.5rem ;
background-color: rgba(41, 41, 41, 0.477);
font-size: 0.8rem;
border-radius: 0.3rem;
display:inline;
}
.img{
width: 50%;
heigth: auto;
object-fit: cover;
}

.table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
font-size: 16px;
text-align: left;
line-height: 1.4;
color: #e0e0e0; / Light text color for dark backgrounds /
background-color: #1e1e1e; / Dark background color for the table /
}

.table th, .table td {
padding: 12px 15px;
border: 1px solid #333; / Darker border color /
}

.table th {
background-color: #2d2d2d; / Slightly lighter background for headers /
font-weight: 600;
}

.table tr:nth-child(even) {
background-color: #2d2d2d; / Alternate row color for readability /
}

.table tr:hover {
background-color: #333; / Highlight row on hover /
}

.table thead th {
background-color: #2a2a2a; / Slightly darker background for the header /
border-bottom: 2px solid #444; / Darker bottom border /
}

`

Using Markdown syntex:
`
H1 heading = # text
H2 heading = ## text
H3 heading = ### text
Bulleted list = * text
Numbered list = ^ text
Bold = text
Code block = ` code `
inline Code block = code
Blockquote = > text
insert link = URL
Text divider or horizontal line = ---
image = !alt
image = !alt
Markdown tables are created using pipes (|) to separate columns and hyphens (-) to define the header row. Here's a basic example:
| Header 1 | Header 2 | Header 3 |
|------------|------------|------------|
| Row 1 Col 1| Row 1 Col 2| Row 1 Col 3|
| Row 2 Col 1| Row 2 Col 2| Row 2 Col 3|

``