タグ

デザインに関するmo_sanのブックマーク (16)

  • 配色を考えるときに便利なオンラインツール10個集めてみました | WP-E (仮)

    最終更新: 2018年4月14日 皆様こんにちは!最近WP-Eメンバーに名を忘れられているような気がするWP-E HINOTANです。寿司ネタがどこかへ行ってしまいましたね。 さて今回はタイトルの通り、便利な配色ツールを紹介していきたいと思います。 Adobe Kuler まずはAdobeが提供しているAdobe Kulerから。こちらは有名なので知っている方も多いと思います。Adobe KulerはPhotoshopやIllustratorとの連携機能があるので便利です。(Adobe Creative CloudのアカウントIDが必要となります) 「Explore」のページでは、様々なカラーパターンを見ることができ、気に入ったものを登録したり編集したりすることができます。登録したカラーパターンはPhotoshopやIllustratorにも反映されます。 Color Hexa Colo

    配色を考えるときに便利なオンラインツール10個集めてみました | WP-E (仮)
  • Webサイトの担当になりましたぁ~♪ - トウフ系

    会社のWeb担当をすることになりました。 主に自社サイトの更新を行うだけですけど。でも現在あるサイトはホームページビルダー全開って感じで、前々から「もうちょっとイカした見た目にしたらどうだろう」とは思っていたんですよね。 はじめてパソコンを買ったころ(17年くらい前)、HPを作成しました。それが楽しくて、もともとクリエイティブな仕事にあこがれていた私はWebデザイン仕事をやってみたいと思っていました。 その勢いでDTPとWebデザイン担当で就職したけどセンスも努力も足りなくてクビになりました。 そんな私が持ちうる知識で会社のホームページビルダー全開なWebサイトを改善したいと意気込んでおりますので、まずはその知識を試すためにブログに案をアップしてみようと思います。 ☆社名のロゴ 太目のPOP字体でインパクトのある光っているネオンのような目立つロゴを考えました。 これで会社のHPを見た方に

    Webサイトの担当になりましたぁ~♪ - トウフ系
    mo_san
    mo_san 2014/09/11
    たくさんのフレームと、検索に引っ掛かってしまってる"秘密のページ"もよろしく
  • 写真の色情報を調べよう!カラー成分測定「色とりどり」:色抽出アプリ

    配色事例 | パステルカラー | ビビットカラー | アースカラー || ロリポップ!のドメインは選べる全104種類!! 色を見る、色を楽しむ、色を判定する!写真や画像の彩りを解析します!Web画像解析ツール 写真画像のカラーデータを分析します。写真やイラストに使われている「主色」テーマカラーとその割合・カラーコードを教えてくれます。いろいろ調べてみましょう。こんな色が使われていたのかという色との出会いが待っています。 (選択した画像ファイルを送信前に確認できるようになりました: 2019.5.29) 画像ファイルを選んで下さい↓(アップしたデータは解析後に自動削除されます) ++画像ファイルを選択 画像ファイルの選択後、下の「画像のカラー成分を抽出」ボタンを押してください。 色について知ろう カラー成分測定「色とりどり」は画像の色をデータ分析し色を判定するツールです。 色との出会い 色の

    mo_san
    mo_san 2014/08/13
    その画像の持つ色の割合がわかる
  • floatを解除する手法のclearfix と 次世代のレイアウトの話

    floatを解除する手法のclearfix と 次世代のレイアウトの話 2013-06-20 / 2013-06-30 2011年にclearfixについて記事を書きましたが、Micro clearfixなどの新しい手法も出てきました。 記事を書いてから2年が経ち、色々思うところも出てきたので、改めてclearfixについて書きます。 floatを解除するには CSSでレイアウトの構築を行う際に、よくfloatプロパティが用いられます。 しかしfloatを使用すると、「親の背景が表示されない」「下の段のレイアウトが崩れる」などのトラブルが起こりやすくなります。 floatプロパティの特性 親の背景が表示されない理由は、floatプロパティを指定しているボックスが浮動化し、通常のボックスのフローから外されることが原因です。 通常フローから外されたボックスは、親のボックスの高さを認識できなくな

    floatを解除する手法のclearfix と 次世代のレイアウトの話
  • 今日のミクスレの謎の流れ - 覚え書きオブジイヤー

    485 名前:名無しさん@お腹いっぱい。[sage] 投稿日:2007/11/04(日) 14:50:01 ID:???0 「初音ミク」のイラストの凄い点 http://blogs.itmedia.co.jp/london/2007/11/post_e142.html それぞれのミク像があっていいんじゃね? 494 名前:名無しさん@お腹いっぱい。[sage] 投稿日:2007/11/04(日) 14:54:04 ID:???0 >>485 うん。ツインテールの緑髪でマイクかネギもってて服はグレーが基調だとミクに 見えるよな。確かに言われてみれば。 507 名前:名無しさん@お腹いっぱい。[sage] 投稿日:2007/11/04(日) 15:03:54 ID:???0 >>485 ただ思うんだがミク単体だと色身が単調すぎてどこかに ワンポイントの色を入れないと絵的に辛くなるんだな 絵描き

    今日のミクスレの謎の流れ - 覚え書きオブジイヤー
  • CSS Gradient Background Maker

    Use this demo to create CSS background-image gradients. The CSS markup works in browsers (including Internet Explorer 10, Chrome, Firefox, Opera, Safari) that support CSS3 gradients in unprefixed form or with any of the following prefixes: ms, moz, o, webkit.

  • 貼る、剥がす。紙の可能性、ぐんぐん広がる! « GQ JAPAN

    mo_san
    mo_san 2012/02/29
    紙で作ったいろいろのモノ。tapehook
  • ロフトがあったらやってみたい、こんなイルミネーション(画像) | naglly.com

    写真の投稿主が過去住んでいたサンフランシスコにあるアパートのロフトに飾り付けたイルミネーションだそうです。狭いロフトもイルミネーション一つでこんなに素敵な空間になるんですね! この部屋に関するflickrのフォトセットはこちらです。 My tiny SF studio/loft. - a set on Flickr http://www.flickr.com/photos/noodylicious/sets/72157622879239207/ ロフトを子供部屋にしている方、この飾り付けを一度やってみてはどうでしょうか。こんなロフトが待っていたら、普段夜更かしする子供も夜になるのが待ちどうしくなるかもしれません。 以下、このロフトの写真を掲載します。 ロフト上、ベッドスペースの写真。 遠くから眺めた風景もなかなか素敵です。 昼間はこんな感じ。

    ロフトがあったらやってみたい、こんなイルミネーション(画像) | naglly.com
  • あんずいろapricot×color

    手書きフォント「あんずもじ」を配布しています。 「あんずもじ2020」「あんずもじ等幅2020」 あんずもじがリニューアルしました。(2020.3.1) 「なつめもじ」「なつめもじ抑」 明治から令和までの合字が書けるようになりました。(2020.1.15) フォントのお知らせ・日常など。 フォントをダウンロードするには メニューの「フォント」からお入りください。 規約をお読みになってから、 ダウンロード・インストールし、末永くご愛用下さい! --------------------------------------------------------- に,参加しています。 [あんずもじ完全版]がウエブフォントとしてお使いになれます。 --------------------------------------------------------- サイトリニューアルに伴い 白背景写真素

    mo_san
    mo_san 2010/10/16
    フリーのフォントを公開されています。可愛らしいけど可愛すぎない手書きフォント。あんずもじ
  • カラーコード HTML・CSS用

    Webデザイン用のプチツール 選択したデザインパターン上でブロックの色を変えことができます。選択したブロックのカラーコードも表示されます。 配色保存用アドレス機能 あなたの作った配色をブログやメールで紹介することができます。パレット右上の「保存用URL表示」をクリックするとURLが表示されますのでコピペしてご利用ください。 配色のヒント 雑誌や生活雑貨を参考にする 文が読みにくい配色はさける。 同系統の色でまとめてみる。 同じぐらいの彩度でまとめてみる。 WEBデザインのヒント 重要なナビゲーションは、探せばすぐに見つかるように配置する 色、文字の大きさ、ブロック周りの余白を調整すると、目立つようになる ページを開いて、まずどこに目がいくのかを意識する 関連のある情報を固める 関連性の薄い情報ブロックの間には余白を入れる

  • JavaScript スタイルシートサンプル集

    border のプロパティを使って三角形を生成し、 :before擬似要素 / :after擬似要素で 対象要素内の先頭 / 末尾に、これを追加します。そして 見出し体の適切な位置に配置して、リボンを表現します。 CSS リボン風見出し サンプル 容量1GB、月額125円、高性能なサーバが日最大級のバックボーンに直結。 さくらのレンタルサーバ。 サンプルソース <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>リボンのような見出しをCSSで表示</title> <style> /* リボン風見出し 体 */ .ribbonBox0{ position: relative; /* 相対配置(相対位置)*/ width: 440px; line-height: 26px; /* 行の高さ */ ma

    JavaScript スタイルシートサンプル集
  • Background Image Maker

  • http://www.designwalker.com/2009/02/clone-webdesign.html

    http://www.designwalker.com/2009/02/clone-webdesign.html
  • DesignWalker

    DesignWalker
  • ホームページを作る人のネタ帳

    ホームページを作る人のネタ帳
  • メインページ - GlyphWiki

    【お願い】使用言語登録のお願い(お知らせ) グリフウィキにようこそ! グリフウィキ(GlyphWiki)は、明朝体の漢字グリフ(漢字字形)を登録・管理し、皆で自由に共有することを目的としたウィキです。 一般的にフォントや個々の漢字グリフの管理は面倒ですが、グリフウィキでは簡単に漢字グリフをデザインすることができ、さらにウィキですので漢字グリフ1つ1つを独立して管理できます。また、グリフを集めてフォントを作り、即座に公開することができます。 グリフの管理は誰でも可能です。また、登録されているグリフは自由に使うことができます。自分が必要なグリフを必要なだけ登録し、既に登録されているデータの一部と合わせ、まとめてフォントにすることができます。現在1,000,000を超える量の漢字グリフが登録されています(別名同字形グリフを別カウントの場合)。 あなたの持っている外字データ・異体字データをグリフウ

    メインページ - GlyphWiki
    mo_san
    mo_san 2009/03/06
  • 1