[{"data":1,"prerenderedAt":318},["ShallowReactive",2],{"help-\u002Fhelp\u002Fappearance":3},{"article":4,"counterpart":166},{"id":5,"title":6,"body":7,"description":157,"extension":158,"meta":159,"navigation":160,"order":161,"path":162,"seo":163,"stem":164,"__hash__":165},"help\u002Fhelp\u002Fappearance.md","ページの見た目を変える",{"type":8,"value":9,"toc":142},"minimark",[10,13,17,22,25,29,32,35,38,41,44,50,53,56,79,84,88,99,102,105,109,112,120,123,130,133],[11,12,6],"h1",{"id":6},[14,15,16],"p",{},"thamitでは、ページの雰囲気を自分好みに変えられます。\nエディターの外観設定(テーマ\u002Fフォントのドロワー)から、編集を止めずにその場で調整できます。",[18,19,21],"h2",{"id":20},"配色テーマプリセット","配色テーマ(プリセット)",[14,23,24],{},"あらかじめ用意された配色プリセットから選べます。\nベースの色合いやアクセントカラーがまとめて切り替わるので、いちばん手軽に印象を変えられます。",[18,26,28],{"id":27},"ライト-ダーク","ライト \u002F ダーク",[14,30,31],{},"ページの明るさを「ライト」または「ダーク」で固定できます。\n公開ページの閲覧者は、ページ上のトグルで好きな方に切り替えて見ることもできます。",[18,33,34],{"id":34},"角丸",[14,36,37],{},"パーツやボタンの角の丸さを「シャープ」「ソフト」「ラウンド」から選べます。\n角丸はプリセット(色合い)から独立した設定なので、プリセットを変えても角丸は変わりません。",[18,39,40],{"id":40},"パーツの出現アニメーション",[14,42,43],{},"公開ページをスクロールして各パーツが画面に入ったとき、一度だけ再生されるアニメーションを設定できます。\n「フェードアップ」「フェード」「ズーム」「グリッチ」から選べます(初期値は「なし」)。",[45,46,47],"blockquote",{},[14,48,49],{},"端末で「視差効果を減らす」(モーションの軽減)を設定している閲覧者には再生されず、パーツは最初から表示されます。",[18,51,52],{"id":52},"カスタム背景",[14,54,55],{},"プリセットの背景の代わりに、自分で背景を指定できます。",[57,58,59,67,73],"ul",{},[60,61,62,66],"li",{},[63,64,65],"strong",{},"単色"," … 好きな色(#rrggbb)をページ全体の背景にできます。文字色は読みやすいように自動で調整されます。",[60,68,69,72],{},[63,70,71],{},"画像"," … アップロードした画像を背景にできます。読みやすさのために、暗めの覆い(スクリム)と白文字で表示されます。",[60,74,75,78],{},[63,76,77],{},"動画"," … 短いループ動画を背景にできます(ライブ壁紙のようなイメージです)。",[45,80,81],{},[14,82,83],{},"カスタム背景を設定すると、見た目は1つに固定され、ライト\u002Fダークの切り替えは効かなくなります。",[85,86,87],"h3",{"id":87},"動画背景のポイント",[57,89,90,93,96],{},[60,91,92],{},"MP4 または WebM 形式で、無料プランでは1ファイル4MBまでです。10秒前後・720p程度の小さいファイルがおすすめです。",[60,94,95],{},"音は再生されません。",[60,97,98],{},"端末で「視差効果を減らす」(モーションの軽減)や省データモードを設定している閲覧者には、動画の代わりに先頭フレームの静止画が表示されます。",[18,100,101],{"id":101},"フォント",[14,103,104],{},"本文のフォントを「ゴシック」「丸ゴシック」「明朝」「ポップ」「手書き」から選べます。\nページの雰囲気に合わせて書体を変えてみてください。",[18,106,108],{"id":107},"アバターの枠フレーム","アバターの枠(フレーム)",[14,110,111],{},"アバター画像のまわりに飾り枠を付けられます。",[57,113,114,117],{},[60,115,116],{},"枠の種類は「なし」「細いリング」「太いリング」「二重リング」「グロー」から選べます。",[60,118,119],{},"枠の色は、アクセントカラーに合わせるか、好きな色を指定できます。",[18,121,122],{"id":122},"プレビューの配色",[14,124,125,126,129],{},"外観設定の「プレビューの配色」は、プレビューと編集中のパーツをライト\u002Fダークどちらの配色で表示するかの切替です。\n",[63,127,128],{},"公開ページ自体の初期配色は変わりません","。初期配色は、プリセット選択のライト\u002Fダークの段で決まります。",[131,132],"hr",{},[14,134,135,136,141],{},"設定した見た目は、プレビュータブで確認できます。\n基本操作は ",[137,138,140],"a",{"href":139},"\u002Fhelp\u002Feditor-basics","エディターの基本"," を参照してください。",{"title":143,"searchDepth":144,"depth":144,"links":145},"",2,[146,147,148,149,150,154,155,156],{"id":20,"depth":144,"text":21},{"id":27,"depth":144,"text":28},{"id":34,"depth":144,"text":34},{"id":40,"depth":144,"text":40},{"id":52,"depth":144,"text":52,"children":151},[152],{"id":87,"depth":153,"text":87},3,{"id":101,"depth":144,"text":101},{"id":107,"depth":144,"text":108},{"id":122,"depth":144,"text":122},"配色テーマ・ライト\u002Fダーク・背景・フォント・アバターの枠など、ページの外観を整える方法を紹介します。","md",{},true,7,"\u002Fhelp\u002Fappearance",{"title":6,"description":157},"help\u002Fappearance","7shfB6x_NTKweEnzYIQFWsjz2Nz6f_hL6ehx5BPhd4c",{"id":167,"title":168,"body":169,"description":312,"extension":158,"meta":313,"navigation":160,"order":161,"path":314,"seo":315,"stem":316,"__hash__":317},"help\u002Fhelp\u002Fen\u002Fappearance.md","Customize your page's appearance",{"type":8,"value":170,"toc":300},[171,174,177,181,184,188,191,195,198,202,205,210,214,217,237,242,246,257,261,264,268,271,279,283,290,292],[11,172,168],{"id":173},"customize-your-pages-appearance",[14,175,176],{},"With thamit, you can style your page to match your vibe.\nOpen the appearance settings in the editor (the theme\u002Ffont drawer) and adjust everything on the spot, without leaving your work.",[18,178,180],{"id":179},"color-themes-presets","Color themes (presets)",[14,182,183],{},"Choose from a set of ready-made color presets.\nEach preset switches the base tones and accent color together, so it's the quickest way to change your page's impression.",[18,185,187],{"id":186},"light-dark","Light \u002F Dark",[14,189,190],{},"You can fix your page's brightness to \"Light\" or \"Dark\".\nVisitors to your public page can also switch between the two with a toggle on the page.",[18,192,194],{"id":193},"corner-radius","Corner radius",[14,196,197],{},"Choose how rounded your blocks and buttons look: \"Sharp\", \"Soft\", or \"Round\".\nCorner radius is a setting independent from the color presets, so changing the preset won't change your corners.",[18,199,201],{"id":200},"block-entrance-animations","Block entrance animations",[14,203,204],{},"You can set an animation that plays once as each block scrolls into view on your public page.\nChoose from \"Fade up\", \"Fade\", \"Zoom\", or \"Glitch\" (the default is \"None\").",[45,206,207],{},[14,208,209],{},"For visitors who have \"Reduce motion\" enabled on their device, the animation is skipped and blocks are shown from the start.",[18,211,213],{"id":212},"custom-backgrounds","Custom backgrounds",[14,215,216],{},"Instead of the preset background, you can set your own.",[57,218,219,225,231],{},[60,220,221,224],{},[63,222,223],{},"Solid color"," … Use any color (#rrggbb) as your page's background. Text colors are adjusted automatically for readability.",[60,226,227,230],{},[63,228,229],{},"Image"," … Use an uploaded image as the background. For readability, it's shown with a dark overlay (scrim) and white text.",[60,232,233,236],{},[63,234,235],{},"Video"," … Use a short looping video as the background — think of it as a live wallpaper.",[45,238,239],{},[14,240,241],{},"When a custom background is set, the page's look is fixed to a single version and the light\u002Fdark toggle no longer applies.",[85,243,245],{"id":244},"video-background-tips","Video background tips",[57,247,248,251,254],{},[60,249,250],{},"MP4 or WebM, up to 4MB per file on the free plan. A small file around 10 seconds at 720p works best.",[60,252,253],{},"No audio is played.",[60,255,256],{},"Visitors with \"Reduce motion\" or data-saver enabled on their device see a still image of the first frame instead of the video.",[18,258,260],{"id":259},"fonts","Fonts",[14,262,263],{},"Choose the body font from \"Gothic\" (sans-serif), \"Rounded gothic\", \"Mincho\" (serif), \"Pop\", or \"Handwritten\".\nTry a typeface that matches your page's mood.",[18,265,267],{"id":266},"avatar-frames","Avatar frames",[14,269,270],{},"You can add a decorative frame around your avatar image.",[57,272,273,276],{},[60,274,275],{},"Frame styles: \"None\", \"Thin ring\", \"Bold ring\", \"Double ring\", or \"Glow\".",[60,277,278],{},"The frame color can follow your accent color, or be any color you pick.",[18,280,282],{"id":281},"preview-color-scheme","Preview color scheme",[14,284,285,286,289],{},"The \"Preview color scheme\" option in the appearance settings switches whether the preview and the blocks you are editing are shown in light or dark.\n",[63,287,288],{},"It does not change your public page's initial color scheme."," The initial scheme is determined by which row (light\u002Fdark) you pick when choosing a preset.",[131,291],{},[14,293,294,295,299],{},"You can check your styling in the preview tab.\nFor editor basics, see ",[137,296,298],{"href":297},"\u002Fhelp\u002Fen\u002Feditor-basics","Editor basics",".",{"title":143,"searchDepth":144,"depth":144,"links":301},[302,303,304,305,306,309,310,311],{"id":179,"depth":144,"text":180},{"id":186,"depth":144,"text":187},{"id":193,"depth":144,"text":194},{"id":200,"depth":144,"text":201},{"id":212,"depth":144,"text":213,"children":307},[308],{"id":244,"depth":153,"text":245},{"id":259,"depth":144,"text":260},{"id":266,"depth":144,"text":267},{"id":281,"depth":144,"text":282},"How to style your page — color theme presets, light\u002Fdark, backgrounds, fonts, avatar frames, and more.",{},"\u002Fhelp\u002Fen\u002Fappearance",{"title":168,"description":312},"help\u002Fen\u002Fappearance","RiIzXY0eqZS8OIwv9oofQ5AQBEFE_XUH8afR-8s9JkA",1786008344236]