shokika.css

A lightly modern reset CSS.

shokika.css is a modern CSS library that provides cross-browser default styles.

note: shokika means "initialize" in Japanese.

Installation

You can install shokika.css using npm, Yarn, or a CDN.

npm

npm install shokika.css

Yarn

yarn add shokika.css

CDN

https://unpkg.com/shokika.css@latest/dist/shokika.min.css

Usage

You can use shokika.css by importing it into your project.

Import

@import '~shokika.css';

If you want to consider the loading order and specificity, use the Cascade layers to load it.

@layer reset, tools, base, components, utilities;

@import 'shokika.css' layer(reset);

HTML

<link rel="stylesheet" href="https://unpkg.com/shokika.css@latest/dist/shokika.min.css" />

Usage with "CSS in JS"

You can also use shokika.css with "CSS in JS" libraries like Emotion.

import { css, Global } from '@emotion/react';
import resetCSS from 'shokika.css/dist/string';

const globalStyle = css`
  ${resetCSS}
`;

export const CSSReset = () => <Global styles={globalStyle} />;

Variations

It is available in node_modules directory:

• shokika.css: raw CSS file
• shokika.min.css: minified CSS file (recommended for production)

Support

Warning
Support for modern browsers.

shokika.css supports modern browsers, but does not support IE11 or other legacy browsers.