厳選・オープン・無料

Jonasmosesson Se

イラストレーターアニメーターのための、遊び心のあるミニマルなポートフォリオ。

PlayfulGalleryCleanCalmPortfolio
Jonasmosesson Se のスクリーンショット
↓ デザインシステムをダウンロード (42 MB)OpenDesign で開く

オリジナル: https://jonasmosesson.se

📦 パックの中身を見る →

01

デザイン DNA

遊び心のある手描きの親しみやすい気まぐれなミニマルな

スケッチブックが実体化したようなもの

02

カラー

#0057FFInk
#FFD7CEBG
rgba(0,87,255,1)Line

柔らかい温かみのある背景と鮮やかなブルーのアクセントを用いた、2トーンのハイコントラストパレット。

03

タイポグラフィ

humanist-sans

マイクロテキストやラベルの全大文字には、幅広な文字間隔を使用します。

04

余白

4px
8px
16px
24px
32px
48px
64px
96px

大きなパディングブロックを用いた、ゆったりとした垂直方向のスペーシング。

05

サーフェス (角丸 / 影 / 罫線)

sm · 0px
md · 0px
lg · 0px
pill · 999px

なし。フラットなカラーブロックに依存します。

06

レイアウト

1280container
12columns
24pxgutter
768 / 1024breakpoints

フルワイドのヒーローセクションに続き、フラットなカラーブロックによる対称的な2x2グリッド。

07

モーションとインタラクション

250msmicro
400mssmall
800msmedium
cubic-bezier(0.25,0.1,0.25,1)easing

hover時の滑らかなカラートランジションと不透明度のフェード。

繊細な不透明度の変化と色のシフト。 · 標準的なリンク動作。

08

コンポーネント

09

文体と禁止事項

10

パック内の実スクリーンショット

Jonasmosesson Se — 桌面首屏（hero）
桌面首屏（hero）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Jonasmosesson Se — 移动首屏
移动首屏

実ページから取得 · 実 computed styles

11

System Prompt

イラストレーターアニメーターのための、遊び心のあるミニマルなポートフォリオサイト。デザインは、柔らかく温かみのあるピーチ色（#FFD7CE）の背景と鮮やかなブルー（#0057FF）のアクセントを特徴とするシンプルな2トーンカラーパレットに依存します。タイポグラフィは、表現力豊かな手描き要素を持つ、軽量なヒューマニストサンセリフです。レイアウトはゆったりとしており、テキストには中央揃いのコンテナを使用し、ポートフォリオには無地のカラーブロックによるフルブリード2x2グリッドを使用します。重要な禁止事項：複雑なグラデーションやテクスチャは避け、セリフフォントは使用せず、重いドロップシャドウは追加しないこと。トーンはカジュアルで親しみやすく、歓迎するものにすること。

このセンスを AI エージェントへ

この設計の機械可読な仕様——カラー・タイポ・モーションまで——をそのまま AI エージェントに渡せます。

OpenDesign スキル ↗ · このパック（エージェント用） ↗

en · zh-CN · zh-TW · ja · ko