2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

CSSフレームワーク(KUROUTO Kit)を作って公開してみました

Last updated at Posted at 2021-01-26

CSSフレームワーク

CSSフレームワークと言うと、やはりBootStrapが一番有名ですかね。
自分としてはUIkitがデザイン的に好きだったりしますが。
有名どころを色々と使ってみてUIkitに落ち着いたものの、やはり毎回カスタムなどは必要になってくるので、なら自分なりのCSSフレームワークを作ってみようと。
#あと国産(日本産)のCSSフレームワークがあまり無いなーと思い。

KUROUTO Kit

上記のような経緯で開発を始めたので、製作者の好みに忠実なCSSフレームワークに仕上がっています(笑)
なので、結構とんがった仕様になっているのではないかと。
画面開発をしながら必要なパーツから整備していっているので、まだまだ使えるCSS定義も少ないです。
あと、オリジナルとはいえ既存のCSSフレームワークを参考にしているので、おそらくUIkitの影響を一番受けています。

一旦公開できる程度には整備できたので、公開してみることにしました。(継続して絶賛開発中です!
気に入ってくれる方が居れば、是非ご利用ください。m(_ _)m
#選択肢の一つとなれれば嬉しい限りです。

一応特徴としては、

  • 各種CSS定義にカスタムプロパティを採用。
    カスタムプロパティを上書きすることでデザインのカスタムが容易に。
    フレームワークを使うことによりデザインが似通ってしまうデメリットの対策にも。
  • 基本フォントにWebフォントを採用。
    各種デバイスでフォントを統一。(もちろん、通常フォントも使えます。)
  • クラスで基本コンポーネントを指定し、大きさやデザインなどの違いを属性で指定する形の設計としています。
  • 日本語のドキュメント。(整備中ですが。。。

現在WEBアプリを一から開発する機会があり、そこでKUROUTO Kitを採用し一緒に育てています。
なので、WEBアプリの開発が終わるころ(2021/08)にはアプリを開発するのに必要最低限な機能は揃う予定です。
現状、v0.0.2として公開中。

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?