土と水の研究所 — 紙テクスチャ・ナチュラル
子ども向けの環境教育 NPO のサイトを、再生紙のような質感と植物 SVG、有機的な角の丸みで構成したサンプルです。
NPO・環境教育・自然学校・地域コミュニティなど、「写真をたくさん使えなくても雰囲気を出したい」団体向けのサンプル HP です。
こんな方に向いています
- 環境系・教育系の NPO や任意団体
- 写真素材がまだ少ない、活動初期のチーム
- 大企業っぽくしたくない、手づくりの空気を出したい団体
構成
HERO カードは角の丸みを左右で変えて、有機的な不揃いさを出しました。続いてミッション 3 軸、プログラム、活動の数字、最近のレポート、入会・寄付の順で並べています。背景に CSS で粒子テクスチャをかけて、紙っぽさを出しました。
live preview
プレビュー
related
関連するサンプル
コミュニティ の他のサンプル、または 複数セクション HP の似た構成のサンプルです。
NPO このはな
コミュニティ · 新聞 ・ 明朝 ・ 密度 ・ 罫線 2026-05-05
西伊豆通信 — ブロードシート新聞
地方の小さな新聞のオンライン版を、紙面のブロードシート構造そのままで作ったサンプルです。題字・リード・サイド・4 段組・編集後記・番組欄まで載せています。
題字 ・ 発行号リード記事 + サイドコラム地域ニュース 4 段組編集後記
コミュニティ · 夜・紺×ピンク・電波 2026-05-05
Tokyo Wave 88.3 — 夜のコミュニティ FM
毎晩 22 時から放送する夜間 FM 局を想定したサンプル HP。波形 SVG と ON AIR の点滅で、放送中の空気を出してみました。
ヒーロー(波形アニメ)番組表(縦タイムライン)DJ 紹介リスナー投稿
コミュニティ · サクラ×クリーム・暖かみ・物語 2026-05-05
Hand to Hand — チャリティ寄付 LP
NPO・チャリティ団体の月額寄付獲得 LP。サクラとクリームの暖色でストーリーテリング型に組み、寄付の透明性も数字で示しました。
ストーリーテリング型 hero活動内容 3 つ寄付プラン 3 段階透明性の数値
このサンプルが気になったら
このサンプルをベースに、文章・写真・色味をお客さまの事業に合わせて作り直してご提供できます。
まずは 30 分の無料相談で、構成のすり合わせから始めましょう。