Markdown as Web Page/Site

  • By Casualwriter
  • Last update: Dec 30, 2022
  • Comments: 2


Casual-Markdown-Page directly use markdown files as web page or web site (ie. markdown-as-webpage).

Just a single html file index.html to load markdown file into web page by the syntax of index.html?file={}

It is very handy to build simple web-site from markdown files, for example,


  • single html, all-in-one version index-one.html
  • vanilla javascript, no dependence
  • support all browser (include IE9)
  • dark mode
  • responsive, support mobile

Usage Guide

  1. copy index.html or index-one.html to web server
  2. copy and other files (*.md) to the folder

that's it!

  • by default, it will load as home page.
  • hotkey [alt-s] to show markdown html for developer
  • hotkey [alt-k] to showpage in dark mode
  • for mobile, click on title to show/hide TOC.
  • use frontmatter for page configuration (title, menu, navigation), for example
github  : 
title   : Casual-Markdown 
style   : #header { background: RoyalBlue } // additional style, optional
menu    :    
  Home            :
  Supported Syntax:
  md-as-Doc       :
  md-as-Page      :
  md-as-Blog      :
  [DarkMode]      : javascript:darkmode()

## {{ title }} 

[casual-markdown]({{github}}) is a super lightweight RegExp-based markdown parser, 
with TOC and scrollspy support

Modification History

  • 2022/08/11, v0.60, initial release.
  • 2022/08/12, add all-in-one version. index-one.html



  • 1

    Remote File Inclusion

    Remote File Inclusion

    Remote File Inclusion With Remote File Inclusion (RFI for short), attackers can also integrate remote files that are located on other servers. So it is of course very easy to smuggle in your own code.

    What creates file inclusion vulnerabilities?

    File inclusion security gaps arise when unfiltered variables that may contain user input are passed to the include functions mentioned.

    casual-markdown parser Has great potential, but is unfortunately susceptible to RFI and LFI. Appropriate filters ( ../ // ) should still be installed)

    Demo: and

    Unfortunately, my JS knowledge is not sufficient to prepare a pull request with modified code :/

  • 2

    Dark Mode By Default for Single Page

    I am just wondering if there is a way to default a single page the always be the darkmode in the webpage. For example I am using and I would like to know how to load it to dark mode by default without needing to press the Alt+K buttons.