TOP  >  snippet

Tag : snippet

2018年12月01日

自然の風景を表現したコードスニペットまとめ「10 Beautiful Nature Inspired Code Snippets」

デザインの主役となるコンテンツを考えるとき、簡単に取り入れることができるコードスニペットがあると便利ですよね。今回は、デザインをカスタマイズするときに役立つコードスニペットまとめ「10 Beautiful Nature Inspired Code Snippets」を紹介します。

gazou1
Pure CSS Jellyfish

自然の風景をテーマにHTMLやCSS、JavaScriptで作られたコードスニペットがまとめられています。気になったものをいくつかピックアップしましたので、下記からご覧ください。

詳しくは以下
(さらに…)

続きを読む
このエントリーをはてなブックマークに追加

過去の記事からランダムで表示

2012年08月25日

CSS3の空間的な動きをサンプルソースとともにまとめた「Intro to CSS 3D transforms」

スマートフォンの普及で、HTML5での開発も多くなっており、オブジェクトの制御はjavascriptやCSS3で行なうシーンも増えてきました。今日紹介するのは、CSS3で実現できる空間的な動きをサンプルソースとともにまとめた「Intro to CSS 3D transforms」です。

様々なサンプルソースが公開されており、オブジェクトを変形させるトランスフォームの基礎からそちらを利用したカードがめくれるようなアクションや3Dの立体オブジェクトを空間的に動かすものなど、様々なサンプルが公開されています。今回はその中からいくつか気になったもの紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 06:21  |  
Category: WebDesign   
2015年04月01日

定番として使用できるフリーアイコンセットまとめ「Free PSD Icons: 450+ Icons for Designers」

webサイト制作で重要な役割を担うアイコンは、フリーで配布されているものも非常に多く重宝するもの。ベーシックなものから個性的なものまで、さまざまな種類を持っているデザイナーの方は多いと思います。そんな中今回紹介するのは、定番として使用できるフリーアイコンセットまとめ「Free PSD Icons: 450+ Icons for Designers」です。

icon0401_1
Boldo – Free Icon Set – graphberry.com

比較的、webサイト制作で使用頻度の高そうな種類が揃ったアイコンセットが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Design   
2014年01月21日

CSS3・jQueryで表現するクリエイティブなメニュー「64 jQuery CSS3 Menu Plugins and Tutorials」

殆どのwebサイトで使用されるメニューは、サイト全体のレイアウトにばかりに手を回しがちで、どうしてもデザインがワンパターンになってしまうことも多いと思います。そんな時是非利用したい、CSS3・jQueryで表現するクリエイティブなメニュー「64 jQuery CSS3 Menu Plugins and Tutorials」を今回は紹介したいと思います。

jqmenu1
Responsive Multi-Level Menu – Demo 1

シンプルで定番として利用できるもの、動きが凝ったもの、形状が個性的なものなど、いろいろなタイプのメニューがまとめられているので、サイトに動きを出したり、ちょっとした仕掛けを取り入れたい時に便利に利用できます。

詳しくは以下

(さらに…)

続きを読む
2013年07月02日

比較的最近公開されたピクセルフォントまとめ「A New Collection of Pixel Fonts」

楽しげな雰囲気や、レトロなテレビゲームの雰囲気を感じさせるピクセルフォント中から、比較的最近公開されたフォントをまとめた「A New Collection of Pixel Fonts」を今回は紹介したいと思います。

dd_font_01
Pixel Millennium font by Zdeněk Gromnica – FontSpace

ポップで可愛らしいフォントから、レトロゲームの雰囲気をそのまま楽しめるフォントまで、さまざまなタイプが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 07:31  |  
Category: Font   
2018年01月21日

水彩の草花の風合いが美しいイラストセット「Botanical Garden Watercolor Set」

高い技術を活かしたデザインがどんどん進化する中、アナログな手描きのデザインは常に根強い人気を誇っています。そんな中今回紹介するのは、水彩の草花の風合いが美しいイラストセット「Botanical Garden Watercolor Set」です。

botanifree1

ボタニカルテイストの植物イラストをセットでダウンロードすることができるようになっています。

詳しくは以下

(さらに…)

続きを読む
posted 09:00  |  
Category: Design   
2017年01月11日

完結した365日アイコンプロジェクト「365cons」

毎日何かを実施していくというプロジェクトは様々なものが世界中で行われていますが、本当に毎日となると、なかなか難しく、続けるということが如何に偉大な事かを理解させられます。今日紹介するのはそんなプロジェクトの中でも365日実行しきったアイコンプロジェクト「365cons」です。

365cons01

実際に2016年からスタートし、365個のアイコンが並んでいます。全てを紹介するのは難しいですが、いくつかピックアップして紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
2010年01月30日

商用可!ベクターで使えるアイコンセット「Free Exclusive Vector Icon Pack: Web User Interface」

WEB制作に便利に使えるアイコンセット。上手く使えばユーザーインターフェイスの改善やデザインのクオリティアップに役立ちます。今日紹介するのは商用可!ベクターで使えるアイコンセット「Free Exclusive Vector Icon Pack: Web User Interface」です。

icon_vector01

全部で5種類のアイコンがセットになっていて、RSSや検索窓用の虫眼鏡などWEBのユーザーインターフェイスに使えるアイコンがセットになっています。

詳しくは以下

(さらに…)

続きを読む
posted 05:24  |  
Category: Design , vector , WebDesign   
tag: Design vector
2008年04月11日

CSSのカーソル指定が一目でわかる「CSS Cursors」

普段は矢印のカーソル。CSSである程度コントロールできるのは皆さんご存じかと思いますが、普段そこまで使わないので、突然聞かれてもパッと出でこない人も多いんじゃないでしょうか?「CSS Cursors 」では下記のようなCSSで指定できるカーソルの一覧表が公開されています。


画像は一覧表の一部です。

全てのカーソルがInternet Explorer 4、Netscape 6以上のいずれかでサポートされています。またTESTのリンクにマウスカーソルをあわせるとブラウザでどう見えるのかを実際に表示してくれます。対応ブラウザまで表示してくれているのが嬉しいですね。

詳しくは以下

(さらに…)

続きを読む
posted 05:14  |  
Category: WebDesign   
tag: CSS webdesign
2009年06月14日

様々な表現を可能にしてくれるフリーphotoshopブラシセット「75 Sets of Unusual Photoshop Brushes」

制作にバリエーションと幅を与えてくれるphotoshopのブラシ。上手く使えば劇的に制作時間を短縮してくれます。今日紹介する「75 Sets of Unusual Photoshop Brushes」は様々な表現のphotoshopブラシを集めたエントリーです。

photoshopbbs01
Mythology Brushes

全部で75個のブラシセットが公開されていて、建物や人体の一部、警告シンボルなど様々なジャンルのブラシセットが公開されています。今日はその中からいくつか気になったphotoshopブラシをピックアップして紹介致します。

詳しくは以下

(さらに…)

続きを読む
posted 11:42  |  
Category: Design , Photoshop   
2011年09月25日

フリーで利用できる650個以上のepsシンプルアイコンセット「defaulticon」

WEBデザインにおいて便利な素材アイコン。アイコン自体のテイストにもよりますが、汎用性が高く、比較的どんなデザインでも活躍してくれます。今回紹介するのはフリーで利用できる650個以上のシンプルアイコンセット「defaulticon」です。

非常にシンプルなアイコンですが使い勝手がよく、使いやすいアイコンセット。全部で650以上のアイコンが公開されています。

詳しくは以下

d-icon2

データは16×16、32×32、48×48、64×64の、128 × 128、256 × 256のpngデータと編集可能なepsとなっていて、epsで配布されていますので、自由にカスタマイズ可能です。

このアイコンのライセンスは「Creative Commons Attribution-No Derivative Works 3.0 」となっていて、ライセンスに則った形であれば商用、非商用問わず無料で利用でき、WEBから、紙媒体などなど様々なものに利用することが可能です。詳しいライセンスについてはサイト下部に明記してありましたので、ご利用されるかたはご確認ください。

www.defaulticon.com

続きを読む
posted 09:00  |  
Category: Design , vector , WebDesign   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

デザインを開発するという視点からデザイン、WEBデザインに役立つ情報をお伝えします。

ご意見、ご感想、連絡事項があればFacebookページよりお願いたします。

※当サイトのに掲載されている一部画像、スクリ-ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればFacebookページからご連絡ください。即刻削除いたします。
※本ブログの「プライバシーポリシー」です。

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。

【ご注意】「Designworks」の旧ホームページドメインを利用したWEBサイトにご注意ください
Template deisgn by iDEACLOUD inc.
トップに戻る