グラデーション画像を作成 - 無料WEBアプリ - DataChef | TechLagoon
このページでは、好きな２色から成るグラデーション画像を、指定したサイズで作成することができます。 ちょっとしたデザインの背景画像にしたり、PCやスマホの壁紙作成などの用途にご利用ください。 透明や半透明を指定することもでき、不透明色から次第に透明色になっていくようなグラデーションも作成可能です。 線形（縦方向に色１→色２）、円筒形（縦方向に色１→色２→色１）、円形（中心から外側）のグラデーションに対応しており、回転させることもできます。 色を選ぶ際は、「塗りつぶす色」の欄にある色付きのセルをクリックして、カラーピッカーを開いて好きな色を指定してください。 カラーピッカーの中にパステルカラーが数種類セットされており、隣同士のパステルカラーを選ぶと綺麗に仕上がりやすいです。 細かい色合いを自由に指定することもできます。 色相（赤い、黄色いなど）を選ぶ際はカラーピッカーの右端から２番目にあるスラ
CSSのcalc()関数で、レスポンシブ対応のfont-sizeを可変にするスタイルシートを簡単に生成できる無料ツール
レスポンシブ対応で、可変のfont-sizeを定義するスタイルシートを記述するのは、なかなか面倒です。 スマホ表示での最小値、ワイドスクリーンでの最大値を決め、その間は可変サイズで表示されるfont-sizeのスタイルシートを簡単に生成できる無料オンラインツールを紹介します。 font-sizeは自由に定義できるので、日本語のフォントでも最適に利用できます。 Fluid-responsive font-size calculator Fluid-responsive font-size calculatorは、レスポンシブ対応のfont-sizeを可変にするスタイルシートもこの計算機で簡単に生成できます。font-sizeは最小値と最大値を決め、その間のサイズはcalc()関数でスムーズに変更させます。例えば、スマホなどの小さいスクリーンでは16px（最小値）に、ワイドスクリーンでは24p
フォントサイズ・ブロック要素の比率を維持しながら可変させる
画像であれば、例えば「640px×480px」で作成されていれば、CSSで「width:100%;」を設定すると自動的に縦横の比率を保ってレスポンシブル対応してくれます。 ですが「div」などで枠を定義し、その枠の比率を保ったままレスポンシブル対応するにはコツが必要です。 デモ デモページ サンプルコード スタイルシート .nav-box { max-width:200px; height:auto; background:rgba(250 149 157); padding-top: 30%; /* padding-top(%) = 高さ / 横幅 * 100 */ position:relative; } .nav-box p { color: white; position:absolute; top:50%; left:50%; transform: translate(-50%,
Fluid-responsive font-size calculator
Generated CSS: What are fluid-responsive fonts / fluid typography? Also known as: Responsive typography (excellent article), Flexible Type, Fluid Type, Viewport Sized Typography, Fluid Typography, and even Responsive Display Text. They all leverage the viewport width, and / or height, to smoothly scale the font-size rather than switch at specific breakpoints. Some versions address the whole page,
ダミーテキストジェネレータ
文字 生成 選択 リセット オプション 文字の最後に「...」を付ける（「...」は文字数としてカウントしない） 基本 選択した種類のテキスト文字列を生成します。 文字数 入力した文字数の文字列を生成します。 用途 デザインやワイヤーフレーム等のダミーテキストとしてご利用ください。 文字数の指定は、お客様に「○○文字程度で原稿をください。」とお願いする際などの文章量の目安になるかと思います。
画像からdataURLに変換
1x1サイズのbase64透過画像 DataURI 以下のようにMIME TYPE + base64文字列をIMGタグから参照して利用する <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw%3D%3D" /> HTML5 Drag&DropAPI FileAPI UI関連はHTML5で実装 JavaScriptでバイナリデータ取得＆変換 XMLHttpRequestでURLから取得するパターン 参照先のサイト(サーバー側の設定)がクロスドメインに対応していないと取得できない Access-Control-Allow-Origin HTTP_Access_Control view source JavaScript (function(){ 'use stric
Online UUID Generator Tool
What is a version 4 UUID? A Version 4 UUID is a universally unique identifier that is generated using random numbers. The Version 4 UUIDs produced by this site were generated using a secure random number generator. The UUIDs generated by this site are provided AS IS without warranty of any kind, not even the warranty that the generated UUIDs are actually unique. You are responsible for using the U
CSS filter generator to convert from black to target hex color
About HTML Preprocessors HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug. Learn more · Versions Adding Classes In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-
無料でファンタジーな世界観のダンジョンマップを自動生成できる「One Page Dungeon」
ファンタジー系のRPGに出てきそうなダンジョンが自動で作られる「One Page Dungeon」は、無料で使えるウェブサービスです。テーブルトークRPGや自作のゲームにも使えそうなダンジョンマップで、商用のゲームに利用することもできます。 One Page Dungeon by watabou https://watabou.itch.io/one-page-dungeon トップページはこんな感じ。アクセスした時点ですでにページ上部にダンジョンマップが生成されています。 生成されるのはダンジョンマップだけでなく、ダンジョンの名前と説明、数字が振られた小部屋の説明もランダムで生成されます。 例えば以下のダンジョンは「House of Fire King(火の王の家)」というダンジョン。「文明から遠く離れた凍てついた土地の奥深くにあります。最近、ゴブリンの一団によって再発見されました」と説
css-generator
設定できる値 スペース区切りで <左右の距離> <上下の距離> <影のぼかし> <影の広がり> <影の色> <inset> を指定する。 <影のぼかし> <影の広がり> <影の色> <inset>は省略可です。
それっぽい名前ジェネレータ - 西洋ファンタジー用語ナナメ読み辞典「Tiny Tales」
ランダムでそれっぽい名前を生成します。ご利用にはIE4以降のjavascriptが必要です。 作りたい系統の名前を一覧から選んで、[作成]ボタンを押してください。 仕様上5文字のものが多くなってしまいますので、適当に加工して創作物等にお使いください。 参考までに地名の意味一覧を併せて掲載しておきます。
認印作成コーナー
日本の名字上位10000姓が収録されています 名字が表示されない場合は、その名字が収録されていません。 別途製作することはいたしませんので、ご了承ください。 個人使用・企業内での使用はOKですが、商業使用（実際の印章の版下にして使用するような行為）は禁止します。 各種電子印鑑・電子署名サービスの印影として登録されることもお控えください。 Ａ６横版のＰＤＦ認印と画像認印の２つのウィンドウが別々に開きます。ウインドウが重なっていますのでご注意下さい。 ブラウザの設定がポップアップブロックされている場合は、「Ctrl」を押しながら「作成」ボタンを押して下さい。 メニューから保存を選び、保存してください。画像はそのままワープロ文書などに貼り付けできますし、 アウトラインが綺麗なPDF認印はアクロバットのカスタムスタンプとしてご利用できます。 ※電子印鑑・電子署名ではありません 本サービスにおいて生
Spelling Generator
１つのつづりの中で言語を 混ぜる 混ぜない 英:英語風 仏:フランス語風 独:ドイツ語風 伊:イタリア語風 西:スペイン語風 葡:ポルトガル語風 羅:ラテン語風 希:ギリシャ語風 露:ロシア語風 蘭:オランダ語風 洪:ハンガリー語風 芬:フィンランド語風 瑞:スウェーデン語風 諾:ノルウェー語風 丁:デンマーク語風 ★混ぜても混ぜなくても選択された言語のみ使用 ★言語は左の漢字一字で表示、（かっこ）は低確率なので注意 ★各つづりの特定言語っぽさの数値を出す→言語「混ぜない」＋言語一つ選択＋表示「複雑さ順」 使い方と注意↑変換に戻る カナ入力 一度に一つの単語（つづり）で表す言葉を カタカナorひらがな のみで入力して、変換してください。 姓名・ミドルネーム等、複数のつづりで表すはずの言葉を同時に入力しても、認識されない・あるいは意図しない場所で区切られることがあります。 対応しているカナは
適当に描いた絵をスタイリッシュなロゴにしてくれる「Logoshi」を使ってみた
企業のみならず個人でも、スタイリッシュなロゴがあればSNSのプロフィール欄やブログなどに活用することができますが、ちょっとした用途であればあまり費用をかけずに自分で作成したいもの。「Logoshi」は適当に描いた手描きイメージを元にオリジナルでスタイリッシュなロゴを作ってくれるウェブサービスです。 Draw a Logo - Logoshi https://www.logoshi.com/draw-a-logo 上記URLにアクセスすると以下のような画面が表示されます。 「Company Name」の欄には社名を入力します。なお、日本語のテキストには非対応です。 「Slogan」の欄にはスローガンを入力できます。任意なので入れなくてもOKです。 右のスペースはロゴのイメージを描く場所です。赤い四角をクリックするとカラーパレットが出てくるので、20色の中から好きな選びます。 その隣をクリック
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ninic（ニニック）
mimic（ミミック）
ランダム文字生成ウェブアプリ - ウェブアプリ - カンタローCGI
数字を入力するだけ！ハンバーガーボタンジェネレーター
introduction of laravel 6.0
Best Laravel CRUD Admin Panel REST API Generator | InfyOmLabs