Dungeon Sandbox Wiki
Register
No edit summary
Tag: Visual edit
No edit summary
Tag: Visual edit
 
(One intermediate revision by the same user not shown)
Line 29: Line 29:
   
 
'''RGB colors with custom transparency: '''''color: rgba(216, 34, 34, 0.5)''
 
'''RGB colors with custom transparency: '''''color: rgba(216, 34, 34, 0.5)''
|[https://htmlcolorcodes.com/color-picker/ Pick any color]
+
|[https://www.w3schools.com/cssref/css_colors.asp CSS colors]
  +
  +
[https://htmlcolorcodes.com/color-picker/ Pick any color]
 
|Yes
 
|Yes
 
|-
 
|-
Line 62: Line 64:
 
|'''Set background color '''<nowiki>(text | link)</nowiki>
 
|'''Set background color '''<nowiki>(text | link)</nowiki>
 
|none
 
|none
|'''Simple colors: '''''color: black''
+
|'''Simple colors: '''''background: black''
'''HEX colors: '''''color: #4286f4''
+
'''HEX colors: '''''background: #4286f4''
   
'''RGB colors: '''''color: rgb(216, 34, 34)''
+
'''RGB colors: '''''background: rgb(216, 34, 34)''
   
'''RGB colors with custom transparency: '''''color: rgba(216, 34, 34, 0.5)''
+
'''RGB colors with custom transparency: '''''background: rgba(216, 34, 34, 0.5)''
 
|[https://htmlcolorcodes.com/color-picker/ Pick any color]
 
|[https://htmlcolorcodes.com/color-picker/ Pick any color]
 
|Yes
 
|Yes

Latest revision as of 14:15, 23 April 2018

Different parameters can be applied using CSS syntax in the Style field to customize decorations in your dungeon. This page describes the most commonly used ones.

Important notes[]

  • Multiple parameters must be separated with semicolon (";").
  • Format: parameter: value; parameter2: value;

Common parameters:[]

Parameter

Definition

Default Value

Examples

Reference

<span>

color[]

Define color (text | link) white Simple colors: color: black

HEX colors: color: #4286f4

RGB colors: color: rgb(216, 34, 34)

RGB colors with custom transparency: color: rgba(216, 34, 34, 0.5)

CSS colors

Pick any color

Yes

font-size[]

Define font size in % (text | link) 500% (100% for partial editing) font-size: 1000% Yes

font-weight[]

Make text bold(er) (text | link) normal Simple: font-weight: bold

Precise (100-900 with 100 steps): font-weight: 900

Yes

text-shadow[]

Add shadow to a text (text | link) none text-shadow: 0.1vw 0.1vw black Learn more Yes

background[]

Set background color (text | link) none Simple colors: background: black

HEX colors: background: #4286f4

RGB colors: background: rgb(216, 34, 34)

RGB colors with custom transparency: background: rgba(216, 34, 34, 0.5)

Pick any color Yes

border[]

Set border (text | link | image) none vw - flexible units: border: 0.5vw solid black

px - inflexible units: border: 10px

All border variations Partial

opacity[]

Define opacity (transparency) (text | link | image) 1 opacity: 0.5 Yes

top[]

left[]

Change position by changing offset from top and left edge (text | link | image) 50% top: 25%; left: -10% No

transform: scale()[]

Scaling (text | link | image) 1 transform: scale(3) No

transform: rotate()[]

Rotation in deg (degrees) (text | link | image) 0 transform: rotate(-30deg) No

Partial styling[]

You can style parts of a text by wrapping any part in <span> tag OR additional tags (see below) and using the above parameters (see <span> column in table above):

E.g.: This is <span style="background: black; color: gold">my text</span>

Additional tags:[]

Tag

Definition Examples

<b>[]

Bold text <b>Bold text</b>

<i>[]

Italic text <i>Italic text</i>

<a>[]

Link <a href="http://baben.co" style="color: pink">Website</a>

<hr>[]

Horizontal line Text<hr style="border: 1vw solid blue">Another paragraph