LogoMark.png

Plugin/SetBgColor の変更点


#author("2021-03-22T14:04:39+09:00;2020-03-30T20:14:48+09:00","default:member","member")
#author("2021-03-22T14:05:23+09:00;2021-03-22T14:04:39+09:00","default:member","member")
#navi(../)
~

// SETTINGS ///////////////////////////////////////////////////////
#setbgcolor(plum)
#setbgcolor("linear-gradient(-90deg, #FF00A1, #F6FF00)")
#settextcolor(white)
/////////////////////////////////////////////////////////////////////////

*Plugin SetBgColor
ページの背景色を設定
~

***概要
-当該ページに背景色を設定するプラグインです。
[[Plugin/SetTextColor]]と合わせて利用することを想定しています。
-編集画面内の先頭部分に記載して下さい。
-[[SideBar]] のページに設定するとサイト全体に適用されます。
-適用の優先順度は、以下のとおりです。
--1. 個別ページで設定されたもの(当該ページにのみ適用)
--2. SideBar で設定されたもの(サイト全体に適用)
--3. システムの skin において設定されたもの(サイト全体のデフォルト) 
-参考:SideBar に #includesubmenu が記載されている場合は、 
''◯◯/SubMenu'' に設定すると◯◯/ 仮想階層全体に適用されます。

-このページでは、編集画面内に以下のように記載しています。
 #setbgcolor("linear-gradient(-90deg, #FF00A1, #F6FF00)")
 #settextcolor(white)
~

***書式
 #setbgimage( color )

-引数は、CSS の background: プロパティーに設定可能な値です。
-単純な色名の場合はそのまま記述すれば適用されます。
 #setbgolor(red) , #setbgcolor(#333),  #setbgcolor(#4057F2)
-カンマや記号を含む設定の場合は、ダブルクオートで囲んで渡して下さい。
 #setbgcolor("linear-gradient(#1EFFFF,#0533FF)")
~

***配色参考
-グラデーションの生成
--http://jxnblk.com/shade/
--https://uigradients.com/

-Material Design Color Palette Generator
--https://www.materialpalette.com/   
PrimaryColor(MainColor)とAccentColor の2色を選択すると、サイトを構成する色彩パレットが自動生成されます。CSSファイルとして DL可能です。
--https://www.materialpalette.com/colors
Click で色値がコピーされます。

-ColorBlender.com | Your free online color matching toolbox
http://www.colorblender.com/

-Color Code
http://www.colourco.de/

-Paletton - The Color Scheme Designer
http://paletton.com/

-HUE/360 The Color Scheme Application
http://hue360.herokuapp.com/

~
~

#navi(../)
~