最近のWebサイトやスマホアプリで見かけるテクニックをはじめ、Web制作者としてよい刺激になるスタイルシートを巧みに使ったさまざまなアイデアを紹介します。 イラスト: Girls Design Materials CSSのみで実装されているのものもたくさんありますが、JavaScriptやSVGなどを必要に応じて使用されているものもあります。
CSSの引き出しを増やしておこう！最近見かけたスタイルシートのアイデア・テクニックのまとめ
最近のWebサイトやスマホアプリで見かけるテクニックをはじめ、Web制作者としてよい刺激になるスタイルシートを巧みに使ったさまざまなアイデアを紹介します。 イラスト: Girls Design Materials CSSのみで実装されているのものもたくさんありますが、JavaScriptやSVGなどを必要に応じて使用されているものもあります。
指定したカラーをベースに、Webデザインやイラストで使えるカラーパレットや美しいグラデーションを生成できるテンプレート -Color Creator Templates
指定したカラーをベースに、そのカラーからバリエーションを調査し、Webデザインやイラストで使えるカラーパレットや美しいグラデーションを生成できるテンプレートを紹介します。 Color Creator Templates -GitHub Color Creator TemplatesはBSDライセンスで利用でき、3つのアプリ用にカラーテンプレートが用意されています。 Photoshop Sketch Affinity Designer Color Creator Templatesの使い方 Photoshop用のカラーテンプレートを例に使い方を紹介します。 Color Creator Templatesではテンプレートを使用して、カラーのバリエーションを調査し、カラーパレットを作成できます。通常のカラーツールでは見いだせない2, 3色のカスタムカラーのブレンドモードを使用することもできます。
色比率
ベースカラー RGB データ ≫ R : - G : - B : ／ RGB 平均値 :: ／ ベースカラー 補色 ::
0to255
Hex code RGB functional notation HSL functional notation Distance from base color HSL lightness value Click to copy Pre-orders now open! Color Studio transforms 0to255 into a comprehensive color tool that's ultra-efficient, inspiring to use, and delightfully unique. Available Spring 2024. Read the announcement Pre-order Color Studio 1 year at $2/month + 3 months free “A near perfect color picker”
The Best Color Tools For Web Designers
The Best Color Tools For Web Designers Colors are the very basic and important element of any design, you need to be really careful about creating colors for your designs. Today we are talking a little bit about colors in web design and we have collected some good tools and articles to help you master in creating color combinations. Colors considered to be the important factor of any kind of desig
iOS11(GA版)におけるScreen Recording(スクリーンキャプチャ)と動画再生の関係まとめ - Qiita
iOS 11で変わったこと OSのNative機能としてScreen Recording(スクリーンキャプチャ)機能が追加されました。iPhone端末の画面上で表示している映像や音声を、ビデオ(動画)として録画, 保存できます。 ここでは、動画コンテンツを配信している事業者さん向けに、主にコンテンツのセキュリティをどのように担保するのかといった観点で記述します。 既にAndroid で導入されているScreen Recording APIに似ていますが、使い勝手がちょっと違うのでまとめてみました。 AndroidでのScreen Recording制御方法についてはこちら テスト結果と対策方法 音声収録 ふつうに画面中の音声も綺麗に録音できる。Preview 版では「画面中の音は録音できず、外部マイクから録音できる」仕様だった認識だったが、GA版で変わった？ コントロールセンターからキャプ
Brightcove Player(NGP)で音量をデフォルトミュートにする方法 - Qiita
Brightcove Playerとは VideoJSのAPIやプラグインを拡張したプレイヤー http://www.videojs.com/ Developer Docsはこちら http://docs.brightcove.com/en/video-cloud/brightcove-player/index.html やりたいこと プレイヤーロード後に音量をデフォルトミュートにしたい。 <script id="script" type="text/JavaScript"> videojs("PlayerId").ready(function(){ var player = this; player.muted(true); }); </script> Register as a new user and use Qiita more conveniently You get artic
iOS10 Mobile Safariにおけるビデオの自動再生（インライン再生） - Qiita
iOS 10で変わったこと これまでのMobile Safariでは、HTML<video>タグでembedした動画を自動再生させることができませんでした。これはHTML5ではなくApple社による制約事項です。 そのため、アウトストリーム動画広告(インフィード, インバナー等)ではCanvasにレンダリングするなど、<video>タグを使用しないワークアラウンドが一般的でした。 これがiOS10からは、条件付で<video>タグを自動再生できるようになりました。 https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_0.html 記述例 デフォルトの挙動
【保存版】配色アイデアに迷わない、すごい配色カラーパレットツール107個まとめ
「配色えらびのベストな方法が知りたい」 「イメージにあった色をもっと手軽に選びたい」 「色がなかなか決まらない」 「配色えらびにAIを活用してみたい」 この記事では、配色えらびが苦手なひとに役立つ無料ツールをまとめてご紹介します。 ２０１６年８月の初投稿から９年かけてわたしが見つけた、実践向けの配色ツールをカテゴリ別に揃えました。 リンクの切れたツールは削除し、新しいデザインツールを追加した最新版にアップグレード。 配色の基本ルールを頭に入れておけば、お気に入りの色を効果的に見つけることができますよ。 コンテンツ目次 普段使いできる便利ツール（17個） ワンクリック、人工知能系ツール（20個） マテリアルデザイン系ツール（4個） Webデザイン・UIデザイン関連ツール（21個） 写真から抽出系ツール（2個） インスピレーション系ツール（14個） グラデーション関連ツール（29個） 配色カラ
ひらめきをデザイン素材にしてくれるアプリ 「Adobe Capture」 - DeNA Design
こんにちは。デザイン戦略室デザイナーの和波です。 今日は、ぱっと思いついたアイデアのストック・共有・活用に便利なアプリAdobe Capture をご紹介したいと思います。iOSとAndroidどちらでも使えます。 スマホで撮影した写真からカラーテーマやブラシやベクトルシェイプに変換やパターン等のライブラリを抽出し、IllustratorやPhotoshopで使えるデジタル素材にしてくれるアプリです。 Adobe Captureで作った素材はライブラリに自動追加されるため、AdobeCCのIllustratorやPhotoshopでライブラリを読み込めばすぐに使えます。
株式会社デモ - 御社の「最高」を目指して。
私たちはshopifyパートナーとして、オンラインショップの構築を得意としています！ shopifyなら安く、そして簡単にオンラインショップを開設することができます。
[CSS]背景は固定、美しいブラーがかかった半透明のパネルやサイドバーやボタンを実装するスタイルシート
背景画像は固定表示で、美しいブラーがかかった半透明のパネルやサイドバーやボタンがスクロールするコンテンツを実装するスタイルシートのアイデアを紹介します。 例えばパネルをクリアにして、背景をブラーにするなど、反転させてみるのも美しい見た目になります。 .blur-container.blur-8 { --bg: url(background.jpg); overflow: hidden; background-image: var(--bg); } .blur-container.blur-8::after { background-size: cover; background-position: center; background-attachment: fixed; opacity: 0.8; -webkit-filter: blur(6px); filter: blur(6px);
![[CSS]背景は固定、美しいブラーがかかった半透明のパネルやサイドバーやボタンを実装するスタイルシート](https://cdn-ak-scissors.b.st-hatena.com/image/square/fd057f6b3e7535c99e31d0c606db378bb2b2e215/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201701%2F2017021304-08.jpg)
配色の参考！美しいCSSグラデーションカラーを集めたギャラリーサイトuiGradients
カラーリング、配色の参考にしたい美しいCSSグラデーションカラーをあつめたギャラリーサイトuiGradientsが、個人的にデザイン制作で役に立ったので、備忘録的エントリーとしてご紹介します。 画面いっぱいに表示されるスライダーから、お気に入りのグラデーションカラーを見つけたら、画面左下に表示されている「Get CSS Code」をクリック（Enterキーを叩くキーボード操作も可能）。CSSコードが表示されるので、「Copy to Clipboard」でコピー完了です。 デイ・トリッパー（Day Tripper）やモヒート（Mojito）、ジューシー・オレンジ（Juicy Orange）などネーミングも素敵ですよ。
ブルーナカラーのCMYK値、RGB値、Webカラー値｜1bit::mobi
画像のソースは祖父江さんのtwitpicにある画像（RGB）（CMYK）を元に、画像をphotoshopで開き、色の数値をまとめたものです。 実際の書籍はすべて専用の特色で印刷しているそうなので、あくまで近似色です。 色 RGB （値はR,G,Bの順） CMYK （値はC,M,Y,Kの順） Webカラー
ハンバーガーメニューはもう古い！代わりに使えるモバイル用ナビメニュー5つまとめ
ウェブサイトを制作しているひとなら、モバイル端末におけるハンバーガー型ナビゲーションメニューの見つけにくさと効率の悪さ、またどれだけUXデザインの邪魔になっているのか、いくつもの記事を読んだことがあるでしょう。（この問題の参考にしたい記事はこちらやこちら、こちら、こちらからどうぞ。） 幸いにも多くのサイトやアプリで、より効率的な解決法となる代替アイデアが試されています。今回紹介しているアイデアは、他のものより優れているというわけでなく、コンテンツや内容によってパフォーマンスや実行できるかどうかは変わってきます。 01. タブ型ナビゲーションメニュー もしウェブサイトやアプリの項目が限られている場合、ユーザーはできるだけ素早くそカテゴリを切り替えたいところ。そんなときは、タブ型ナビゲーションが良い解決方法となるでしょう。 タブはもっともシンプルなナビゲーションパターンですが、デザインを制作す
ギャラリー 桜の木
只今の展覧会Current Exhibition 『移転・連絡先変更のおしらせ』 この春 ギャラリー桜の木 銀座本店は 銀座5 丁目から4 丁目へ移転 無事 新所在地での新装工事を終え営業開始いたしました これも皆様方のひとかたならぬご支援とご厚情の賜物とスタッフ一同 心より感謝申し上げております 新たな気持ちで邁進いたします 今後とも何卒よろしくお願い申し上げます 移転に伴い「住所」「電話番号」「 FAX 番号」 が変更となりましたので 新しい連絡先をお知らせいたします ［新店舗］ 〒104-0061 東京都中央区銀座4丁目3-6 G4 BRICKS BLD. 7階 TEL 03-6228-6646 FAX 03-6228-6750 皆様のご来廊を心よりお待ち申し上げております。 第27回 中西 和 の 世界 6月9日（日）〜6月24日（月） 午前11時－午後7時 火祝休廊 ギャラリー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
美しいグラデーションカラーをまとめている・「uiGradients」
はためく布（リボン状）オブジェクトを簡単に作成.pdf
Japan – Alliance Graphique Internationale (AGI) – 512 creative professionals from 46 countries
https://pbs.twimg.com/media/CWaL4mzVAAA2wjS.jpg
