ENG
  • KOR
  • ENG
  • JPN

picocss

css-framework responsive layout

PicoCSSはセマンティックHTMLのためのミニマルなCSSフレームワークです。HTML要素の本来の意味を尊重しながら、シンプルで洗練されたスタイリングを提供します。

Latest Ver 2.1.0
Homepage
Github
0
14,745
📢 PicoCSSはタグの意味を尊重しつつ、クリーンでモダンなウェブデザインを可能にするCSSフレームワークです。

CDNダウンロード

License: MIT
すべてのバージョンを見る
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.amber.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.amber.min.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.blue.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.blue.min.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.classless.amber.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.classless.amber.min.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.classless.blue.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.classless.blue.min.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.classless.conditional.amber.css
https://cdnjs.cloudflare.com/ajax/libs/picocss/2.1.0/pico.classless.conditional.amber.min.css

Sample Code

⚠️ import 文を含む一部のコードは、jsFiddleで正しく実行されない場合があります。エラーが発生した場合は、コードをコピーしてご自身の環境でお試しください。 
⚙️ JavaScript
{ "html": "<button class='primary'>Click me!</button>", "css": "@import url('https://cdn.jsdelivr.net/npm/picocss@1.0.0/css/pico.min.css');" }

Related Libraries

Library Icon
bootstrap

BootstrapはHTML、CSS、JSコンポーネントを使用してウェブサイトやウェブアプリケーションの開発を容易にするオープンソースツールキットです。

⚡ Top Tools for Developers
Text Compare

テキスト比較

2つのテキストの違いを一目で確認できます。

Favicon Generator

Faviconジェネレーター

簡単かつ迅速にファビコンを生成します。

Lorem Ipsum Generator

Lorem Ipsumジェネレーター

デザイン用のダミーテキストを生成します。

Character Counter

文字数カウント

文字数と単語数をリアルタイムで確認できます。

SRT ↔ SMI

SRT ↔ SMI変換ツール

字幕形式を簡単に変換できます。

Text Extract(OCR)

画像テキスト抽出

画像内のテキストを自動で抽出します。