Smooth ShadowMake a smooth css shadow
面倒なレスポンシブイメージの画像作成を自動化してくれる神ツールとブレイクポイントの考え方
レスポンシブイメージ、使ってますか？ ウェブサイトの表示パフォーマンスの最適化をする際に、一番手っ取り早いのが画像の最適化です。そこで、イメージオプティム とかMac Automatorとpngquantなどのツールを駆使して一生懸命に画像自体を最適化したりレスポンシブイメージを使って画像を出し分けたりするわけですけども、特にレスポンシブイメージは手動でやるのは正直言ってかなり面倒です。 そ・こ・で！ 本日ご紹介したいのが「Responsive Image Breakpoints Generator 」です。このツールを使えばレスポンシブイメージの複数画像の作成やHTMLの記述を自動化できて、しかも！アートディレクションまで自動化できるんです。 ということで、今回はレスポンシブイメージについての簡単なおさらいと、画像作成の基本的な考え方、それから自動化について書いてみます。 では、行ってみ
デザインセンスが壊滅的な私が良い感じの配色を実現させている方法 - あなたのスイッチを押すブログ
資料の出来栄えを大きく左右する「色」。資料を作り込むほどのめり込み、抜け出せなくなってしまう。何が正解か分からず、全く抜け出せない泥沼。 「もうちょっと青みを…」「いや、赤みが強すぎるから、彩度を落として…」「この色の組み合わせはないなぁ。何色を差し色にしよう…」 色は無限大。限りある知識と経験だけでは、なかなか正解の配色を手に入れられないことでしょう。 そんな時に私が役立てている、配色に関するお話しを致します。 カラーパレットは自作しない そもそも私は美術的なセンスがありません。美術の成績も、彫刻などの造形ものはそこそこでしたが、絵画的な課題はてんでダメでした。 そんな私が自分で配色を作ろうと思ったら、時間がいくらあっても足りません。そしてクオリティは、かけた時間に反比例していくでしょう。 ですので私は、自分で作りません。他の色んな物を利用します。 それは時に写真や画像であったり、人が作
CSSDesk - Online CSS Sandbox
body { font-family: 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif; padding: 100px; font-size: 13px; } div { background: #fff; margin: 0 auto; width: 200px; padding: 100px; text-align: center; /* border-radius */ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; /* box-shadow */ -webkit-box-shadow: rgba(0,0,0,0.2) 0px 1px 3px; -moz-box-shadow: rgba(0,0,0,0.2
CSS3のグラデーションを自動生成 | Grad2 -CSS3 Easy Gradation Editor
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
インタフェースが良くてプレビューも見やすいCSS3コード生成が可能な「CSS3 Generator」:phpspot開発日誌
インタフェースが良くてプレビューも見やすいCSS3コード生成が可能な「CSS3 Generator」 2011年03月11日- CSS3 Generator - By Eric Hoffman & Peter Funk インタフェースが良くてプレビューも見やすいCSS3コード生成が可能な「CSS3 Generator」。 CSS3ジェネレーターは多くありますが、中でも優れたUIとわかりやすさを持っているように思えるジェネレーターの紹介。 角丸、シャドウ、透明度、グラデーション、枠線、背景色の設定ができ、リアルタイムに反映されます。 あっという間にCSS3コードを生成出来ました。 UIだけでも一見の価値ありです。 関連エントリ CSS3で実装されたボタンのサンプルやチュートリアル総まとめ CSS3で動くプログレスバー作成サンプル ステップで学べるCSS3ボタンのデザインチュートリアル CSS
CSS3を使ったボタンを簡単に作成できるサイト「CSS3 Button Generator」 | ライフハッカー・ジャパン
「CSS3 Button Generator」は、CSS3を使ったボタンが、誰にでも簡単に作れちゃうサイトです。色や影やグラデーションをお好みに応じて設定できますよ。さらに、他のユーザが作ったボタンも閲覧可能です。コードもはき出してくれるので、コピペですぐに利用できます。 以下に使ってみた様子を載せておきます。 まずは、CSS3 Button Generatorにアクセスしましょう。 色などを設定します。テキストの影など細かい部分も調整できます。 右側に、コードが自動的に生成されるので、コピペして使いましょう。さらに「SAVE」すると、他のユーザと共有できます。 他のユーザが作ったボタンがずらり。いいなーと思うボタンがあれば、そのコードも取得できます。ボタン作成を考えている方は、是非お使いください。 CSS3 Button Generator [via delicious] （カメきち）
CSS3 Playground
Version 1.4. Made by Mike Plate @mikeplate Source code on GitHub User interface made with Dojo Reference of CSS3 capabilites from Where can I use and QuirksMode Icons from Farm-Fresh Web Icons Font stacks selected from A Way Back Clipboard copying with Zero Clipboard No copyright. Use everything in any way you like. Use this web application to experiment and learn about new css3 capabilities. The
What about these links...
Mailbook - The free and easy way to collect addresses. Thanks for the link, but... This site has been online since around 2005, so although I try to support legacy pages, sometimes a few vanish into thin air. This is one of them. Go visit the blog homepage to find more about my most recent crazy online projects. Bedrukte adresetiketten bestellen met Mailbook
CSS Menu Builder | Free online navigation generator
“Need a menu for your website or a client, use our free css menu builder and create some pretty sweet menus for free„ Bootstrap Design Tools Bootstrap Design Tools is a set of tools that easily helps you modify the default styles of Twitter Bootstrap components, so that you can make them fit your website's design. DontDream.It has added the possibility of using menus generated via CSS Menu Builder
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
レスポンシブ用の画像を複数のサイズで自動生成
角丸やシャドウ作るジェネレータ。CSS3 Generator
Grad3
指定したHTML用のCSSテンプレートを自動生成してくれるサイト「Bear CSS」 | ライフハッカー・ジャパン
ウェブサイトのレイアウトを簡単に作成できるジェネレータ「PageBlox」 | ライフハッカー・ジャパン
http://e0166nt.com/blog-entry-862.html
IDEA * IDEA
http://e0166nt.com/blog-entry-852.html
IDEA * IDEA
Toptal's CSS3 Generator Tool allows you to easily generate useful snippets of CSS3 and copy them straight into your projects.