This package has been deprecated

Author message:

This package is deprecated. Switch to wysiwyg.css or github-markdown-css.


2.0.2 • Public • Published


— A compact CSS library for a pleasant reading experience on the web

npm (scoped) GitHub release (latest by date) npm bundle size (scoped) GitHub last commit GitHub

Remarkability provides beautiful and accessible styles for the content generated by the rich-text editors in a CMS or from a markdown file. It comes with sensible defaults that can be customized using Sass.

Get started

Using NPM or Yarn

Add to your project with NPM or Yarn.

npm install @microflash/remarkability
yarn add @microflash/remarkability

This is the recommended way if you want to customize Remarkability using Sass.

Using CDN

Add one of the following <link> elements in the <head> of your HTML document.

<link rel="stylesheet" href="">
<link rel="stylesheet" href="">

By default, these CDNs will serve the latest published version. Refer to the unpkg / jsDelivr docs for other possible ways to get Remarkability.


You can also download the latest version or browse the previous releases on GitHub.


Just add .remarkability class to your container to style the elements within.

<article class="remarkability">
  <!-- HTML content -->

By default, Remarkability inherits colors and typography from the parent element but you can customize this behavior with Sass.

With v1.0.0, Remarkability deprecated the global variant. If needed, you can still build it by setting $root variable to body using Sass.

Import what you need

With v1.1.0, Remarkability provides you the flexibility to import what you need; you may choose to import the entire remarkability.scss file or pick the specific parts. The following parts are available for you to import individually.

@use 'node_modules/@microflash/remarkability/scss/variables';
@use 'node_modules/@microflash/remarkability/scss/root';
@use 'node_modules/@microflash/remarkability/scss/all';
@use 'node_modules/@microflash/remarkability/scss/inline';
@use 'node_modules/@microflash/remarkability/scss/media';
@use 'node_modules/@microflash/remarkability/scss/block';
@use 'node_modules/@microflash/remarkability/scss/headings';
@use 'node_modules/@microflash/remarkability/scss/lists';
@use 'node_modules/@microflash/remarkability/scss/form';
@use 'node_modules/@microflash/remarkability/scss/blockquote';
@use 'node_modules/@microflash/remarkability/scss/code';
@use 'node_modules/@microflash/remarkability/scss/table';


For more details and examples, check out the docs.


  • Execute yarn start to bring up the documentation site which contains an example page.
  • Use yarn dist to generate a CSS build.
  • Use yarn docs to generate the static version of the documentation.


Licensed under MIT.


Remarkability is built with the generous contributions from the open-source community. It would not have been possible without wysiwyg.css by Jeremy Thomas, github-markdown-css by Sindre Sorhus and the invaluable references on MDN. The typeface used in the logo is Maragsâ Display by John David Maza. The icons are from Octicons, a part of GitHub's Primer design system.

Package Sidebar


npm i @microflash/remarkability

Weekly Downloads






Unpacked Size

78.2 kB

Total Files


Last publish


  • naiyer