ITエンジニア/デザイナ向けにオープンソースを毎日紹介

コンピュータはどんどん進化しており、より繊細なグラフィックス、リアルに近づく3D、臨場感あふれるサウンドといった具合に私たちを引きつけ続けています。そんな中、初代ファミコンもまた人気を持ち続けています。8bitでレトロ、とても今のコンピュータとは比較にならない代物であるにも関わらず、今なお多くの人たちを魅了しています。

そんなファミコン風のUIをWeb上で再現できるのがNES.cssです。懐かしさの中に楽しさを感じる、スタイルシートです。

NES.cssの使い方

ボタンやコンテナの表示。それっぽいデザインですね。

ラジオ。まるで戦うや逃げるといった選択肢を選ぶような…。

チェックボックス。ごつごつしたドット絵風の表示がいいですね。

入力系。主人公の名前を入れるやつですね。

メッセージ。ノスタルジックなチャットが作れそうです。

テーブル。何の装飾もないのがいいですね。

アイコン。まさにドット絵。拡大するとシャギーになるのがいい感じです。

NES.cssは使いどころが限られますが、TwilioQuestのようなゲームを作ったり、訪問者がちょっと遊べるゲームを作ったりするのにぴったりでしょう。もちろんWebサイトのインパクトに使っても面白そうです。

NES.cssはCSS製のオープンソース・ソフトウェア(MIT License)です。

NES.css

BcRikko/NES.css: NES-style CSS Framework | ファミコン風CSSフレームワーク

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2