あなたが、いま実装しようとしているレイアウトは、おそらくCSSで実現できるでしょう。 ただし日常の業務をこなしながら、日々進化するCSSの最新テクニックを習得するとなれば、話はまったく別です。 仕事で使えるCSSの技術を、時間をかけて学ぶよりも、ボタンやドラッグ＆ドロップ操作で、思い通りのレイアウトを自動で生成できる「ジェネレーター（英: Generator）」を活用してみましょう。 新しいプロジェクトにコピー＆ペーストで利用でき、瞬時に思い通りのレイアウトを作成、はじめてのひとにもオススメの時短ツールを厳選しています。 コピペ一発！便利なCSSレイアウトジェネレーターおすすめ12選（Grid ＆ Flexbox編） ここでは、CSS Grid と Flexbox で表現できるレイアウト用ジェネレーターと便利なリソースを一緒にまとめてご紹介します。 Layoutit! grid-templ
これはすごい便利！ HTMLはdiv一つ、あとはCSSをコピペするだけで500種類以上のローダーが簡単に実装できる -CSS Loaders
HTMLはdivたった一つ、あとはCSSをコピペするだけで約580種類のローダーを実装できるCSS Loadersを紹介します。 ローダーは、バーやドットのシンプルなアニメーションから他ではあまり見ない面白いものまであり、ローダーを探すときはここをチェックすることをお勧めします。ローダーが不要な人でもCSSアニメーションを楽しめると思います。
リンク www.sumida-aquarium.com 東京スカイツリータウン®にある「すみだ水族館」【公式】 東京スカイツリーにあるすみだ水族館。水のいきものたちと親しむバラエティ豊富なプログラムやイベントが盛りだくさん。東京の下町の観光や子連れのお出かけにも最適。近距離の展示空間では、ペンギンたちの行動や表情を間近にお楽しみいただけます。「とうきょうスカイツリー」駅からすぐ。 10 users 105
Windows系最速のコピー・バックアップツールの最新版「FastCopy v5.0.0」がリリース | Techable(テッカブル)
「FastCopy」は年間120万ダウンロードを誇る定番ツールで、長年、高速コピー・バックアップツールとして利用されています。 合同会社FastCopy研究所はこのたび、Windows系最速のコピー・バックアップツールの最新版となる「FastCopy v5.0.0」をリリースしました。Pro版料金は、 年間1ユーザ990円（税抜） / 永久ライセンス1ユーザ4800円（税抜）です。また、対応OSはWindows7以降となっています。 定番高速ファイルコピー・バックアップ「FastCopy v5.0.0」 メイン画面 今回公開した新バージョンは、要望の多かった、完全ベリファイ（Pro版のみ）、Win11用シェル拡張、サイレントデータ破壊検査（Pro版のみ）などを搭載しました。なお今回のリリースから、職場での利用にはPro版ライセンスが必要となります。ただし、2週間のお試し利用期間を除きます。
Open-Source UI elements for any projectCreate, share, and use beautiful custom elements made with CSS or Tailwind.Search
色は人の心理に働きかけることが知られており、デザインに何色を使うかは重要な問題です。特に、異なる色を使いつつ統一感を持たせるのは至難の業で、一歩間違うとまとまりやメッセージ性のない配色になってしまうことも。そこで、プロのデザイナーがウェブデザインのさまざまな配色実例をそのままコピーできる「Happy Hues」を作成し、無料で公開しています。 Happy Hues - Curated colors in context. https://www.happyhues.co/ トップページには画面左側にパレットが表示されています。パレットをクリックすることで、画面右側の配色を変更可能。深緑を中心とした落ち着いた配色から…… ピンクを中心としたファンシーな配色。 グレーベースのシンプルなデザイン。 温かみがある焦げ茶色ベースの配色など、背景だけでなく文字色やボタン、イラストの色まで変わるので画面
const obj = { hoge: [new Date(2023, 3, 12), 1], fuga: 'foo' }; const objClone = structuredClone(obj); // ディープコピー obj.hoge[1] = 10; console.log(objClone.hoge[1]); // 1 objClone.hoge[0].setFullYear(2050); console.log(obj.hoge[0].getFullYear()); // 2023
Amazonも！有名WebサイトのCSSボタンデザイン77個をコピペ再現できる Copy ＆ Paste CSS
CSSボタンデザインは、スタイルを変えるだけでガラリと印象を変えることができるウェブデザイン要素のひとつです。 Copy & Paste CSS は、AmazonやSpotify、Slackといった有名Webサイトで使われているボタンデザイン用CSSスニペット77個を集めた無料ツールです。ボタンをクリックするだけで、Internet Explorer や Chrome などクロスブラウザ対応のCSSソースコードをコピペできます。 詳細は以下から。 AmazonやSpotifyも！有名サイトのCSSボタンデザイン77個をコピペ再現できる Copy & Paste CSS Copy & Paste CSSは、海外でよく見かける有名サイトで使われれているボタンスタイルをCSSで再現し、コピペで実装できるようにまとめたCSSライブラリです。 BootstrapやGithub、Tailwindといっ
他の「はてなブロガー」さんのエントリーに乗っかって自エントリーを書くことがしばしばあります。今回は ふくすけ＆さんきゅう（id:hukusuke39）さんの、こちらの記事を参考にさせていただきました。IDコールお騒がせします。 hukusuke39.hatenablog.com クリの実がまるごと1個入ったクリまんじゅう、いいですね！ HP検索してしまいました。 eshop-yoneya.com しかし今のクリまんじゅうはものすごい勢いで本物のクリに寄せていることがありますが、昔ながらのクリまんじゅうは小麦粉皮に白あん身の、カニかまぼこより古い「元祖コピー食品」のようなものだったと記憶しています。 ウィキペ調べてみました。 ja.wikipedia.org ja.wikipedia.org 諸説あると思われますがウィキペによればクリまんじゅうは1890年代（明治中期）、カニかまぼこは197
仕事が早い人は使っている最新Web便利ツール34選
「Webサイト制作がもっと楽になる方法ってないの？」 「Web制作の最新ツールを試してみたい」 そんな方へオススしたい、Webデザイン制作に役立つツールや素材をまとめてご紹介します。 「これ、もっと早く知りたかった」と思うような便利ツールを中心にセレクトしています。 2024年のデザイントレンドにもぴったりな新Webテクニックを、次のプロジェクトに活用してみてはいかがでしょう。 一緒に最新デザイン素材やツールも目を通しておくと良いでしょう、特に今回は豊作でした。 コピペ系CSSツール 60 CSS 3D Buttons Free Collection CSSとHTMLのみで作られた3Dボタンと、本物そっくりな見た目の「スキューモーフィック」ボタンのコレクション。クリックするとコピーできます。 275 CSS Gradients Collection 美しいCSSグラデーション250カラーが
Die @DieFr_chan アニメ中盤で「敵」から「味方なのかなんなのかよくわからないポジション」になるオネェ系パワー型ファイターが言いそう。 twitter.com/iimannamii/sta… 2021-07-05 22:28:02
無料で使える「Ctrl＋C」でコピーしたあらゆる内容を保存して再利用＆複数PCでの共有もできる「Ditto」を使ってみた
「Ditto」は「Ctrl＋C」でクリップボードにコピーした内容の履歴を表示したり、別のPCにクリップボードの内容を送信したりすることができる無料のクリップボードマネージャーです。どのように使えるのか実際に試してみました。 Ditto clipboard manager https://ditto-cp.sourceforge.io/ まずは公式サイトに行き、ツールをダウンロードします。今回は64bitのPCにインストールするので「Download 64bit」をクリック。 インストーラーをダブルクリックして起動します。 「OK」をクリック。 インストール先は特に変更せず「次へ」をクリックします。 「次へ」をクリック。 「完了」をクリックします。 ネットワークへのアクセス許可を求められるので「許可」をクリック。 Dittoが起動しました。タスクトレイのアイコンをクリックするか、「Ctrl＋
文書ファイルやウェブサイトの内容をクリップボードに保存し別の場所に貼り付ける「コピー＆ペースト」は、PCやスマートフォンが普及した現在は日常的に行われています。コピー＆ペーストはコピーしたい範囲をマウスなどでドラッグすることで指定しますが、指定した通りにコピー＆ペーストできないウェブサイトがあると、エンジニアのAlex Ellisさんが指摘しています。 Don't touch my clipboard · Caffeinspiration https://alexanderell.is/posts/taking-over-my-clipboard/ Alexさんがemダッシュ記号をコピー＆ペーストするため、「The Punctuation Guide」というウェブサイトにアクセスし、その内容をコピー＆ペーストしようとしました。 Em dash | The Punctuation Guide
コピペで簡単に使用できる、HTMLとCSS（複雑なものはSVG）で実装されたWebサイトやスマホアプリ用のローディングアニメーションを紹介します。 さまざまなローディングやスピナーが揃っていますが、画像は一切使用されていません。必要な時にさくっと実装できるので、スニペットに登録しておくと便利です。 下記は静止画ですが、もちろん全部アニメーションで動きます。 Loaders -UI Ball Loaders -GitHub ほかにもCSSで実装されたローディングをチェックしたい人は、下記もどうぞ。 CSSで実装されたローディング・スピナーのアニメーションのまとめ UI Ballのローディングはすべて1Kb未満の超軽量で、依存関係はゼロなので、HTMLとCSSをコピペするだけで簡単に使用できます。カラー・サイズ・アニメーションの速度などはCSSで簡単にカスタマイズできます。 MITライセンスで
Webサイトにおける「ボタン」は、使いやすさと分かりやすさが重要です。このバランスがなかなか悩みどころで、いつも同じスタイルのボタンを色を変えて再利用、なんてことも。 この記事では、コピペで利用できるCSSボタンスタイルを多数公開の便利サイトをまとめてご紹介します。 配布されているCSSボタンは、実際にウェブサイトで利用されているスタイルを中心に、かるく500個を超え、実用的なものから面白ユニーク系までが揃います。クリックひとつでソースコードをコピーできるので、ウェブ制作の時短としてもオススメです。 画像を使わずにHTMLとCSSのみでボタンを作りたいときに便利で、配色や文字サイズなどデザインが修正なときにも、画像を作り直してという面倒な手間を省くこともできます。 ボタン500個超、コピペで簡単CSSで作れるボタンを公開中の便利サイトまとめ CSSButtons.io 2021.11.17
「おしゃれでかっこいいウェブサイトを作りたいけど、レイアウトにいつも困る。」 「同じような似たデザインから抜け出せない」 「周りがあっと驚くWebデザインがしたい」 「CSS Grid や Flexbox プロパティの使いかたを覚えたい」 そんなひとにおすすめしたい、コピペで利用可能な、おしゃれでモダンなWebレイアウト25選をご紹介します。 すべてのテンプレートの特長が以下のとおり。 ✅ モバイルファースト・アプローチに沿ったレイアウト ✅ すべてのブレイクポイントに対応したレスポンシブWebレイアウト ❌ position: absolute;は利用しない ✅ CSS Grid テクニックのみで表現 最先端のCSSテクニックを活用することで、これまでは考えられなかった構図を実現できるようになっています。 コピペでできる、おしゃれな無料レイアウト25選（CSS Grid & Flexbo
ADACHI Masatoshi ../.. 足立昌聰 on Twitter: "厳密に言えば、北朝鮮はベルヌ条約に加入はしているけれど、「日本が国家承認していない北朝鮮との関係では条約上の権利義務関係が生じない」という理由で、同じ結論になる。 https://t.co/i6Jl3vsKu5"
厳密に言えば、北朝鮮はベルヌ条約に加入はしているけれど、「日本が国家承認していない北朝鮮との関係では条約上の権利義務関係が生じない」という理由で、同じ結論になる。 https://t.co/i6Jl3vsKu5
CSS Background Patterns is fun little free tool that lets you create cool CSS patterns for your website background. We've curated and parameterized this collection of pure CSS patterns to help you generate & customize the most cool CSS seamless patterns around the web. The collection is being updated regurarly! Patterns are everywhere! From your website to your favorite book cover. There're severa
Macのプリインストールアプリ「スクリーンショット」がめっちゃ便利だった | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、バックエンドエンジニアのグッチです 今回はMacの標準アプリ「スクリーンショット」がけっこう便利だったので紹介してみます。標準アプリなんてクソみたいなのしかないと思っているそこのあなた。ぜひ一度使ってみてください。 ※ いくつかお便りをいただいたので加筆しました。 全画面をスクリーンショットする方法 ウインドウ単位のスクリーンショットで周りに入る影を消す方法 ウインドウ単位でスクリーンショットをとるためのショートカット この辺りは全然知りませんでした。教えていただきありがとうございます。 ▲最近のランチ： めんたいパスタときのこのカルボナーラのハーフ＆ハーフ 1. A・B・Cを用意しながら麺を茹でます A. ボールに粉チーズを卵、顆粒コンソメ、塩胡椒入れ、かき混ぜてドロドロに（粉チーズ50~100g、卵1個/人 B. オリーブオイルとバターで炒めたきのこ（適当に。ベーコン焼いて
2022年1月25日 JavaScript, jsjs 3Dアニメーションが手軽に実装できるVanta.jsというJavaScriptのライブラリがあります。Webサイト上で色や表示方法をカスタマイズして、コピペするだけで完成です。今回はこのJavaScriptライブラリを紹介します！ ↑私が10年以上利用している会計ソフト！ この記事は動画でも紹介しています。動画派の方はこちらをどうぞ！ 鳥をふわふわ動かしてみよう Vanta.jsのサイトに行くと、デモとして鳥がふよふよ飛んでるような背景が表示されています。この画面右側に、カスタマイズするためのパネルが用意されているので、好みのデザインに変えてみましょう。「Birds」の場合は色や鳥の数、鳥のサイズ、スペース、スピードなどが調整できます。 <div id="bird"></div> <script src="three.r119.min
AnimatiSS
Nice collection of CSS animations for your awesome web projects
Akar Icons
A perfectly rounded icon library made for designers, developers, and pretty much everyone.
はじめに映画化もされた「あなたの人生の物語」（映画化時のタイトルは「メッセージ」でした。監督はドゥニ・ヴィルヌーヴ）などの作品で知られるSF小説家であるテッド・チャン氏が最近著しく話題のChatGPTに関する解説をNEW YORKER誌に寄せました。 適切ではないかもしれない、としながらもChatGPTを非可逆画像圧縮であるJPEGに喩えた内容となっています。個人的にはAIの本質をついているような気もしました。 とても素晴らしい内容ですのでDeepLで翻訳し、若干おかしな訳に手を加えた内容を皆さんと共有します。（本文の改変はしていませんが、個人的に気になった箇所のみ太字としています。私見は訳注として与えております。） ChatGPT Is Blurry JPEG of the Web By Ted Chiang February 9, 2023 本文１2013年、ドイツのある建設会社の社員
Buttons Generator
About Button Generator CSS button generator is a free online tool you can use to create CSS button styles in one click. How do I create a button? Just find a CSS button you like the most and click on it. That’s it! The CSS code for that button is now in your clipboard. Is JavaScript or jQuery required for these buttons to work? Absolutely not. The generated code is CSS-only. Can I use these button
ほんのり影がついたようなドロップシャドウは、「浮いている」ような立体感を演出できる、ウェブサイトでは欠かせないデザイン要素のひとつです。 ドロップシャドウの使い方によって、デザインでユーザーを魅了するUIテクニックで、CSSによる手軽で、柔軟なスタイリングができるのも人気の理由でしょう。 しかし、いざCSSでドロップシャドウを作成しようとすると、設定する項目が多すぎて、なかなか思い通りの影が表現できないことも。 今回は、手軽な設定のみで、魅力的なドロップシャドウを作成できるオンラインツールをまとめてご紹介します。 簡単なクリック操作で、本物そっくりなリアルな影を作成できますよ。 Shadow Palette Generator ツールの特長 Shadow Palette Generatorは、後ほど紹介するツールにはない、ユニークな点が２つあります。 １つのCSSドロップシャドウを生成する
異例の大型連休明け、最初の金曜日の山手線にギョッとする広告が掲出され、SNSで話題を呼んでいる。クラウドファンディング運営会社「CAMPFIRE」の広告だ。 クラウドファンディングとは、新しい事業やプロジェクトのアイデアを持つ人たちが、インターネットを通じて個人から資金を募る仕組み。3月に支援資金総額100億円を突破した同社が、5月10日から16日までの間、全86パターンの「〇〇を理由に夢を諦めてはいけない。」というメッセージを山手線で展開している。 広告が掲出されると、力強いメッセージがTwitter上で話題になり、「彼氏がいないことを理由に #夢を諦めてはいけない」「転勤を理由に #夢を諦めてはいけない」など、自分の思いをハッシュタグを交えて語り出す人も出現。「#夢を諦めてはいけない」というハッシュタグが一時、トレンドキーワードの上位にランクした。
CSSの美しいシャドウもこれなら簡単！ box-shadowを重ねた面倒なコードを簡単に生成できるツール -boxshadows.xyz
直感的なインターフェイスで、CSSのbox-shadowを使用した複雑で美しいシャドウを簡単に作成できるツールを紹介します。 シャドウはさまざまなパラメータで正確に調整でき、リアルタイムにシャドウの見た目とCSSのコードが生成されます。CSSの初心者でも経験豊富な人にとっても便利だと思います。 boxshadows.xyz boxshadows.xyzとは boxshadows.xyzの使い方 boxshadows.xyzとは boxshadows.xyzは直感的なインターフェイスで、レイヤー化された複雑なシャドウを正確に、そして簡単に作成できるオンラインツールです。シャドウのタイプ、シャドウのぼかしと広がり、オフセットの調整など、さまざまなパラメータを調整しながらリアルタイムにシャドウを確認しながら作成できます。
Webデザインの配色に悩んだときの参考になる！ UI要素のさまざまなカラースキームをまとめた配色サイト -Spectrum.Art
WebサイトのUIに使用するヘッダ、ボタン、イラスト、カード、カラム、ラインなど、UI要素のさまざまなカラースキームをまとめた配色サイトを紹介します。 カラースキームはページ全体、コンポーネントごとにまとめられており、それぞれのカラーは16進のHEX値が記載されています。各カラーをクリックするだけで簡単にコピーして利用できます。 Spectrum.Art Spectrum.Artは魅力的で視覚的にも優れたUIデザインを簡単に実現するために、UIデザイナーが厳選した色の調和に優れたカラースキームをまとめたサイトです。鮮やかで人目を引くカラースキームから、繊細でエレガントなカラースキームまで幅広いオプションが提供されています。 Spectrum.Art 2023年9月現在、カラースキームは16種類あり、各カラースキームはページ全体やコンポーネントごとにまとめられています。 では、Color s
clamp(1.5rem, 2vw + 1rem, 2.25rem); clamp(1.5rem, 2vw + 1rem, 2.25rem); Copy link https://modern-fluid-typography.vercel.app?rootFontSize=16&minSize=24&fluidSize=2&relativeSize=1&maxSize=36
UI Buttons
© 2022-present Eluda. This website uses Google Analytics to collect usage data and deliver a better experience.
簡単で便利！Sketch, Figma, AdobeXDなどにコピペで利用できるUIデザイン用のカラーパレットを生成 -CopyPalette
最近のUIデザインでよく使用されている、一貫性のある単色のカラーパレットを簡単に生成でき、そのカラーパレットをSketch, Figma, AdobeXDなどにコピペで利用できるオンラインツールを紹介します。 CopyPalette CopyPaletteは1つのカラーをベースに、濃淡のバリエーションでカラーパレットを簡単に生成できるオンラインツールです。生成されるカラーパレットはSVGなので、さまざまなソフトウェアにコピペで利用できます。 CopyPaletteの使い方は簡単、登録など面倒なことも一切不要です。 まずは、サイトにアクセスします。
CSS Loaders: A collection of more than 600 loading animations
The Biggest Collection of Loading Animations Over 600+ CSS-only loaders made using a single element <div class="loader"></div> Don't know which loader to use? Here is one for you 👇 Click the loader to copy the CSS Get another CSS Loader
ブログなどでコードを記載しているサイトは多いです。その表示方法も様々で、行番号があるもの、ハイライトが付いているものなどがあります。そのコードをコピーしても余計な行番号が付いてきたりして、ストレスと感じたりします。 そこで使ってみたいのがcopy-code-blockです。自由度の高くコードのコピーが可能です。 copy-code-blockの使い方 コードハイライタと組み合わせた例です。 コピーボタンを押すと、コードだけがコピーできます。 <div class='cool-container'> <p class='cool-description'>Get ready for...</p> <ul class='cool-list'> <li class='cool-item'>rainbows</li> <li class='cool-item'>and</li> <li class
Changelog May 17, 2023 Added 16 new patternsUpdated Polish and Russian translationsAdded Afrikaans translation by RaphaelAlves available hereAdded Hungarian translation available hereMarch 24, 2023 Added 12 new patternsFebruary 10, 2023 Added 12 new patternsAdded Ukranian translation by Олег Ярощук and Tomizaki available hereAdded Russian translation by Flay Design available hereUpdated Spanish, F
GitHub - Sanakan8472/copy-dialog-lunar-lander: Play lunar lander in you windows file copy dialog
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
画像を編集できるのは、Photoshopだけではありません。 CSSフィルタで、画像にさまざまなエフェクトを与えることができます。 画像に適用するエフェクトを見ながら、そのCSSフィルタのコードをコピペで利用できるオンラインツールを紹介します。
Gradientaはマルチレイヤーの複雑なCSSグラデーションを紹介、コードもコピーできるプロジェクトサイトです 各グラデーションはCSSだけでなくjpgとしても配布されており、それぞれダーク、ライト、シンプル、鮮やか、対照的、抽象的などのカテゴリに分けられています 中にはCSS製とは思えないものもあって勉強になりました サンプル 1つをサンプルとして用意してみました。任意の要素にコピーしたコードをペーストするだけで使えます 現在150以上の複雑なCSSグラデーションが用意されています。使用するのも勿論、勉強用にも如何でしょうか ライセンスはMITとの事です Gradienta
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
コピペ一発！便利なCSSレイアウト生成ツールおすすめ12選（Grid ＆ Flexbox編）
コードのコピペ時にほぼ絶対やる失敗を「Visual Studio」が防ぐようになる？／インデントされたコードからインデントを削除してコピー可能。実装に向け拡張機能が公開
すみだ水族館がセンスとアイデアに満ちた方法で売れ残ったグッズを販売「発想、デザイン、キャッチコピー力の勝ちじゃんスゴイ」
Explore 3000+ Free UI Elements: CSS & Tailwind
無料でウェブデザインに最適な配色実例をそのままコピペできるようにした「Happy Hues」レビュー
オブジェクトのクローンにJSON化を使う時代は終わった！【JavaScript】 - Qiita
ひょっとしてクリまんじゅうはカニかまぼこより古い元祖コピー食品では？と思ったがしかし… - 🍉しいたげられたしいたけ
薬事法に触れない言い回しを模索する過程で“パワー”に行き着いてしまった化粧品の広告「もう訳がわからん」「力は全てを解決する…」
選択した部分を絶対にそのまま「コピー＆ペースト」できないウェブサイト、その仕組みとは？
これならコピペで簡単！ HTMLはシンプル、CSSで実装された超軽量のおしゃれなローディング・スピナー -UI Ball
CSSボタン500個超！コピペで簡単にボタンを生成できる便利サービスまとめ
コピペで簡単、おしゃれ無料Webレイアウト25選（CSS Grid・Flexbox活用）
【Excel】コピペしたら余計なデータが現れた!? 非表示セルを省いて貼り付けるには【いまさら聞けないExcelの使い方講座】
CSS Background Patterns by MagicPattern
Vanta.jsで3Dアニメーションを手軽に実装！
ChatGPTはWebのボケたJPEGである｜Yossarian
【CSS】box-shadowでリアルな影を作成できる便利ツールまとめ
「夢を諦めてはいけない」 山手線のCAMPFIRE広告に賛否。 代表の家入一真さんが明かす真意とは？
Modern fluid typography editor
copy-code-block - プログラミングコードをクリップボードにコピー MOONGIFT
Pattern Monster - SVG Pattern Generator
画像を扱うプロジェクトに役立つ！CSSフィルタのさまざまなエフェクトをコピペで利用できる無料ツール -FilterSS
マルチレイヤーな複雑なCSSグラデーションのコードをコピーできる・「Gradienta」
「FastCopy 5.6.0」がリリース ～老舗の人気ファイルコピーツール／Pro版に新しいベリファイオプション
i-love-illustration.com
artfoods.hatenablog.com
kashituki.hatenablog.com
freeeillust.com
lambamirstan.hatenablog.com
www.shiho196123.net