UIのフォントサイズ、マージン、コンポーネントで黄金比や白銀比によるバリエーションを簡単に作成できるツール -Proportio
UIデザイン用にフォントやアイコンのサイズ、スペース、角丸、シャドウ、パディング、コンポーネントなどで比例スケールを使用したバリエーションを簡単に作成できるオンラインツール（ローカルも可）を紹介します。 たとえば、黄金比でフォントサイズを設計したり、白銀比でコンポーネントを設計したり、ということができます。また、作成した比例スケールは、CSSで書き出されるのですぐに使用できます。 Proportio Proportio -GitHub Proportioの特徴 Proportioの使い方 Proportioの特徴 Proportioはデザインシステムに必要となるタイポグラフィ、スペースや角丸やシャドウなどのシェイプ、コンポーネントに使用する比例スケールを簡単に作成するためのツールです。 パラメトリックデザイン（変数を基準としてサイズを決める形状作成方法）を採用しているので、体系的なデザイン
注目のWebデザイン用AIツール！ テキスト入力でWebサイトやスマホアプリ向けのカラーパレットをすぐに生成 -AI Colors
テキストを入力すると、Webサイトやスマホアプリ向けの美しいカラーパレットをすぐに生成してくれるAIツールを紹介します。 「企業サイト向けのクールで信頼感のあるカラーで、ベースはホワイト」「子供向けキャンペーンサイト、海と夏のイメージ」こんな感じにテキストを入力すると、Webサイトやスマホアプリ向けのカラーパレットを生成してくれます。 AI Colors AI Colorsの特徴 AI Colorsの使い方 AI Colorsを使ってみた AI Colorsの特徴 AI ColorsはOpenAIのGPT-3.5を使用して、テキストからAIによりWebサイトやスマホアプリ向けの美しいカラーパレットを生成します。また、他の人が作成したカラーパレットを検索・編集・視覚化することもできます。 利用にあたっては無料で、登録なども必要ありません。
無料なのに容量無制限かつPC＆スマホ間の転送も可能なファイル転送サービス「Send Anywhere」レビュー
「写真やムービーを他デバイスや他人に送信したいけど、容量が大きすぎてメールやメッセージアプリでは送信できない」という状況に遭遇した経験がある人は多いはず。無料で使えるファイル転送サービス「Send Anywhere」なら、容量無制限かつ簡単操作でファイルを転送できるだけでなく、スマートフォンでの送信や受け取りにも対応しているとのことなので、実際に使ってファイル送信や受け取りの手順を確かめてみました。 Send Anywhere - 大容量ファイル転送 https://send-anywhere.com/ja/ ・目次 ◆1：PCでのファイル送信＆受け取り手順 ◆2：スマートフォンでのファイル送信＆受け取り手順 ◆1：PCでのファイル送信＆受け取り手順 Send Anywhereにアクセスすると、以下のような画面が表示されます。 ファイルを送信するには、まず送信したいファイルを画面内にドラッ
Web制作を変える！2022年の便利オンラインツール・ベスト110選
Web制作を変える！2022年の便利オンラインツール・ベスト110選 これからのウェブデザインに欠かせないツール大集合 この記事では、2022年に公開された便利なWebオンラインツール・ベスト110個+をまとめてご紹介します。 定期的にリストアップしている最新オンラインツールまとめ記事では、2022年にかけて、合計343個の新しいツールやサービスを紹介してきました。 その中でも、Webデザイン制作に便利なツールを厳選したコレクションで、「無料で利用できるツール」を揃えています。 特に今年は、人工知能やAIテクノロジー関連のツールが増えたことで、Webデザイン制作をより快適に進めることができるでしょう。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 🕹 CSSツール（16個） 🧰 Webデザイン便利ツール（19個） 🦄 デザインツール
グラスモーフィズムをCSSで実装するコードを簡単に生成できるジェネレーター -Glass Morphism Generator
カードやパネルにぴったりな透明度のある背景のぼかしを使った磨りガラスのエフェクト、グラスモーフィズムを実装するコードを生成できるジェネレーターを紹介します。 Glass Morphism Generator Glass Morphism Generator -GitHub このエフェクトは去年の暮れくらいから、Glassmorphismと呼ばれはじめたエフェクトで、古くはiOS7やWindows Vistaでも使用されています。最近では、macOS Big Surでも見かけますね。 参考: Glassmorphism in user interfaces Glass Morphism Generatorでは、磨りガラスの透明度やぼかし具合を確認しながら、コードを生成できます。
Colorize Photo | Try Free | Realistic Colors
Failed to create secure connection. Use Chrome, try a different device or internet connection. 21+ Color filters See your photos in realistic colors Upload your photo, pick your unique filter, and watch your moment transform with vibrant, lifelike colors in seconds. 2.8M+ Users | Rated 4.9 Stars Start for Free
便利な無料ツールが登場！ Webサイトで使用しているCSSや自分が書いたCSSを詳細に解析してくれる -CSS Analyzer
1クリックで、Webサイトで使用しているCSSや自分が書いたCSSを詳細に解析してくれる無料ツールを紹介します。 CSSの検証としておかしなスタイル定義・同じスタイル定義・一貫性のないスタイル定義などを見つけたり、スタイルガイドの作成にも役立ちます。 CSS Analyzer CSS Analyzer -GitHub CSS AnalyzerはWallace CLI, constyble, color-sorterなどの便利ツールをリリースしているProject WallaceのCSS解析ツールです。MITライセンスで、商用プロジェクトでも無料で利用できます。 Webサイトで使用しているCSSファイルや自分が書いたCSSのコードを詳細に解析してくれます。オンラインツールとして簡単に利用でき、GitHubでソースが公開されているので、ローカル環境でも利用できます。 さっそくオンライン版で試し
便利なツールが登場！ 画像をWebPとAVIFに変換・最適化、SVG, PNG, JPG, GIF画像の軽量化・最適化ができるオンラインツール -Optimize Images
次世代の画像フォーマットとして注目されているWebPとAVIF、Webサイトやアプリでよく使用されるSVG, PNG, JPG, GIFの変換・軽量化・最適化ができるオンラインツールを紹介します。 IEのサポートがなくなると、WebPが画像フォーマットの主流になりそうですね。 Optimize Images Optimize Imagesは、画像（SVG, PNG, JPG, GIF）の最適化と圧縮、画像の新しいフォーマット（WebPやAVIF）への変換と最適化が簡単にできるオンラインツールです。 WebPとAVIFは高い圧縮率を備えたフォーマットです。 WebPは簡単に言うとPNG, JPG, GIFの良いとこ取りのフォーマットで、24ビットのフルカラーをサポートしています。高画質の透過PNGのサイズが大きくなってしまうことやGIFアニメーションで色数が少ない悩みも解決します。IE以外の
Web制作にすごい役立つ！ コードの軽量化や整形・ファビコンやQRコード作成・PDF変換など、便利ツールが一箇所で利用できる -ToolsOcean
CSSやJavaScriptのミニファイ（軽量化）、HTMLやCSSやJavaScriptのフォーマッター、各種エンコード・デコード、QRコードの生成、カラー値変換、画像の最適化、ファビコン画像生成、ダミーテキスト生成、各種PDF変換など、Web制作に役立つツールがまとめて利用できるToolsOceanを紹介します。 便利なツールが一箇所で利用できるので、ブックマークしておくと便利です。 ToolsOcean ToolsOceanは完全に無料で利用できるオンラインツールが、たくさん用意されています。登録など面倒なことは一切ありません。 いくつか使用してみました。まずは、CSSの軽量化。 CSSだけでなく、HTML、JavaScriptの軽量化、整形も揃っています。
シンプルで使いやすいのが登場！ UIのデザインで役立つ、色に関する便利なツールがまとめて利用できる -hue.tools
指定したカラーの色相、さまざまな詳細情報、混色・ブレンド・変換・グラデーションなどを生成できるオンラインツールを紹介します。 最近のUIデザインで見かける複数のカラーを使用した美しいグラデーションを生成したり、そのカラーを使用したUIデザインや写真素材なども表示され、色に関する便利なツールがまとめて利用できます。 hue.tools hue.tools -GitHub hue.toolsの特徴 hue.toolsはカラーを操作するためのシンプルなツールで、そのカラーの詳細情報、そのカラーを使用したデザインや写真、混色・ブレンド・変換などを簡単に利用できます。MITライセンスで、商用プロジェクトでも無料で利用できます。 hue.toolsには、4つの機能が用意されています。 info 指定したカラーをさまざまな色空間やフォーマットに変換 Dribble、Behance、Pexelsなどで同じ
文章を入力するだけで「本の表紙っぽい画像」を作成する「装丁カフェ」
二次創作などで小説を執筆しても、その「表紙」に設定する絵が思い浮かばなかったり、そもそも絵が描けなかったりして困ってしまうことがあるはず。「装丁カフェ」は、好きな文字を入力するだけで手軽に「いい感じ」の画像を作成してくれるサービスです。 装丁カフェ | pixiv小説用表紙メーカー https://marunaka3.github.io/tools/project/cover-maker.html pixiv用の表紙が作れるサイトをプレオープンします。ボタン一つで雰囲気のある美しい表紙が作れます。 作った表紙は小説投稿サイトで自由にご利用いただけます。利用報告、リンク等は不要です。 動作確認も兼ねたお試し期間ですので、気軽に遊んでいただけると嬉しいです！https://t.co/WDk0OuyIem pic.twitter.com/S0Ue0WxFDy— しののめ (@shinonome_
日本語フォントがGoogle Fontsに大量追加！すべてのフォントが商用利用も無料のフリーフォントです
フリーフォントが大好物な人に朗報です！ 🎉 先週、Google Fontsに日本語フォントが追加されたので、紹介します。これでさらに、たくさんの日本語フォントがGoogle Fontsで使用できます。 新しく追加された日本語のGoogle Fonts 他にもたくさんある日本語のGoogle Fonts Google FontsのライセンスはほとんどがSIL Open Font Licenseで、商用プロジェクトでも無料で利用できます。他に採用されているライセンスはAPACHE LICENSE, VERSION 2.0です。 フリーフォントが大好物な人には、下記もお勧めです！ 2021年用、日本語のフリーフォント523種類のまとめ -商用サイトだけでなく紙や同人誌などの利用も明記 新しく追加された日本語のGoogle Fonts まずは、先週Google Fontsに新しく追加された日本語
紙の書類を高精度にテキストデータ化できる無料Webサービス『Free Online OCR』【今日のライフハックツール】 | ライフハッカー・ジャパン
取引先から送られてきたFAXや、印刷文書などをテキストデータ化したいこと、ありますよね。 カメラやスキャンアプリで画像化する手もありますが、画像のままだとスマートフォン上で確認したい場合や、内容を抜粋したい場合に扱いにくいのです。 ちなみに、個人的に過去最悪レベルで困ったのは、「セキュリティの問題で、データの状態では渡せない」と言われて紙の名簿を渡され、数百件分を宛名印刷するという、悪夢のような仕事でした…。 OCR（文字認識）アプリは、こんなときに役立つもの。 今回は、筆者が知る限り、無料サービスの中で最高レベルの識字精度を誇るWebサービスをご紹介します。 Screenshot: 田中宏和『Free Online OCR』はインターフェイスが英語ですが、単ページで完結できるシンプルな使い勝手なので、英語が苦手な人でも使いやすいWebサービス。 プライバシーポリシーには以下の点が記載され
【2021年永久保存版】全部知ってる？WEB関係の人なら知らなきゃ損なツール&サービス50選 | Moriricca Media
今回はWEB関係の人なら知らないと損！なくらい便利なツールやサービスを、50個まとめて、利用目的別にご紹介します。 2021年になりましたが、近年より良いサービスが開発されたものもあります。ご自身のニーズにあわせ、並行して利用して頂くのがおすすめです。 この記事では古くなった情報は新しいものに書き換え、時代の流れに沿った最新サービスだけをビッシリと集めさせて頂きました。 今回は２万字の大ボリュームでお届けします！ 一部、個人的な経験談も混じえてご紹介するので、お急ぎの方はこのブログをブックマークし、ポイントだけ押さえて後からじっくりWEBサービスを見て頂けると幸いです。 クライアントにツールを提案したりもできますので、隙間時間にでもゆるりと読んで頂ければと思います。 それではお楽しみください！ （この記事が良いと思ったら自由にシェアしてね） ★サイト解析に使えるツール・サービス 「WEBサ
「Remove.bg」が便利すぎる！1クリックで画像から背景だけを切り抜く、ついにPhotoshopに対応
画像から1クリックで簡単に背景だけを切り抜くオンラインサービス「Remove.bg」がPhotoshopに対応したので紹介します。しかも無料で利用できます！ Photoshopのエクステンションとして利用でき、1クリックで背景だけを画像から切り抜くことができます。下記の切り抜きも1クリックだけです。 写真: ぱくたそ Remove.bg for Photoshopの使い方 Remove.bg for Photoshopのインストール Remove.bg for Photoshopの使い方 Remove.bg for Photoshopをさっそく使用してみました。 操作は1クリックだけなので、説明することがほとんどありません。 まずは、画像を用意します。
普通のコードエディタに見えて実は壮大なゲーム(MMORPG)画面の「CyberCode Online」で遊んでみた！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、どこからどう見てもごく普通のコードエディタに見えて、実はマルチプレイ可能なMMORPGというジャンルのゲームが遊べるちょっと変わったWebサービスをご紹介します。 見た目はVisual Studio Code風の画面レイアウトなのですが、本格的なテキストベースのMMORPGになっていて、友人・知人と一緒に敵と戦いながらプレイヤーを成長させていくことができます。 第三者から見るとゲームで遊んでいるとは思われないのも1つの特徴になっています。 【 CyberCode Online 】 ■「CyberCode Online」の遊び方 それでは、最初に「CyberCode Online」をどのように遊ぶのか詳しく見ていきましょう！ サイトにアクセスすると、ごく普通のコードエディタが表示されるのですが、プログラムをよく見るとsignUp()関数が
有料・無料のクラウドサービスおすすめ8選 | ライフハッカー・ジャパン
Adobeの写真編集ソフト「Adobe Photoshop Lightroom」のiOS版アプリをアップデートしたところ、写真とプリセットがすべて削除されてしまうというバグが発生しました。 Adobeは広範囲に及んだこのバグの報告を受けて、修正パッチを発行してこれ以上このバグの影響を受ける人が出ないようにしましたが、失われたファイルは復元できません。 Adobeによると、iCloudにスマホのバックアップを保存していれば、失われた写真やプリセットの一部は復元できる可能性があるとのことなので、不幸にしてこのバグの被害にあった人は、試してみてください。 ただし、すべての人が復元できる可能性は極めて低いはずです。私はあまりネガティブなことは言いたくありませんが、間違った希望を与えるのも良くないと思います。 突然データを失うというこの残念な出来事のおかげで、写真は複数の場所にバックアップを保存する
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
超高速！ デザインやイラストに最適な色を組み合わたカラーパレット🎨を生成する無料ツール -Colour Palette Generator
CSS GridとFlexboxの便利なツールが登場！ レイアウトを確認しながら、コードを生成できる -CSS Layout Generator
Neumorphism（ニューモーフィズム）のCSSはこれで簡単！スタイルシートを生成できるジェネレーター
