YellowPencil

"Get a Quote" page

Single Customizationemptychanged
current
apply style just to the current page.
Template Customizationemptychanged
current
apply style to all pages of the current post type.
Global Customizationemptychanged
current
apply style to the entire website.

Text

Font Family https://www.kentfireandsecurity.co.uk/wp-content/plugins/waspthemes-yellow-pencil/library/json/google-fonts.json

Font Weight [{"value":"300","label":"Light 300"},{"value":"400","label":"normal 400"},{"value":"500","label":"Semi-Bold 500"},{"value":"600","label":"Bold 600"},{"value":"700","label":"Extra-Bold 700"}]

Color transparent
Flat Material Trend Page Colors

Text Shadow [{"value":"none","label":"none"},{"value":"rgba(0, 0, 0, 0.3) 0px 1px 1px","label":"Basic Shadow"},{"value":"rgb(255, 255, 255) 1px 1px 0px, rgb(170, 170, 170) 2px 2px 0px","label":"Shadow Multiple"},{"value":"rgb(255, 0, 0) -1px 0px 0px, rgb(0, 255, 255) 1px 0px 0px","label":"Anaglyph"},{"value":"rgb(255, 255, 255) 0px 1px 1px, rgb(0, 0, 0) 0px -1px 1px","label":"Emboss"},{"value":"rgb(255, 255, 255) 0px 0px 2px, rgb(255, 255, 255) 0px 0px 4px, rgb(255, 255, 255) 0px 0px 6px, rgb(255, 119, 255) 0px 0px 8px, rgb(255, 0, 255) 0px 0px 12px, rgb(255, 0, 255) 0px 0px 16px, rgb(255, 0, 255) 0px 0px 20px, rgb(255, 0, 255) 0px 0px 24px","label":"Neon"},{"value":"rgb(0, 0, 0) 0px 1px 1px, rgb(0, 0, 0) 0px -1px 1px, rgb(0, 0, 0) 1px 0px 1px, rgb(0, 0, 0) -1px 0px 1px","label":"Outline"}]

Font Size

Line Height

Font Style
Normal
Italic

Text Align
left
center
right
justify

Text Transform
none
Cap
UP
low

Letter Spacing

Word Spacing

Text Decoration
none
over
through
under

Text Indent

Word Wrap
normal
break-word
Background

Background Color transparent
Flat Material Trend Page Colors

Background Image none
Stock Image Gradient Pattern
by uiGradients
Orientation
by Unsplash

Background Clip
text
border
padding
content

Background Blend Mode [{"value":"normal","label":"normal"},{"value":"multiply","label":"multiply"},{"value":"screen","label":"screen"},{"value":"overlay","label":"overlay"},{"value":"darken","label":"darken"},{"value":"lighten","label":"lighten"},{"value":"color-dodge","label":"color-dodge"},{"value":"saturation","label":"saturation"},{"value":"color","label":"color"},{"value":"luminosity","label":"luminosity"}]

Background X Position

Background Y Position

Background Size
auto
length
cover
contain

Background Repeat
repeat
repeat-x
repeat-y
no-repeat

Background Attachment
scroll
fixed
local
Margin

Margin Left

Margin Right

Margin Top

Margin Bottom
Padding

Padding Left

Padding Right

Padding Top

Padding Bottom
Border

Border Type
all
top
right
bottom
left

Border Style
none
solid
dotted
dashed
hidden

Border Width

Border Color transparent
Flat Material Trend Page Colors

Border Top Style
none
solid
dotted
dashed
hidden

Border Top Width

Border Top Color transparent
Flat Material Trend Page Colors

Border Right Style
none
solid
dotted
dashed
hidden

Border Right Width

Border Right Color transparent
Flat Material Trend Page Colors

Border Bottom Style
none
solid
dotted
dashed
hidden

Border Bottom Width

Border Bottom Color transparent
Flat Material Trend Page Colors

Border Left Style
none
solid
dotted
dashed
hidden

Border Left Width

Border Left Color transparent
Flat Material Trend Page Colors
Border Radius

Top Left Radius

Top Right Radius

Bottom Left Radius

Bottom Right Radius
Position

Z Index

Position
static
relative
absolute
fixed
sticky

Top

Left

Bottom

Right
Size PRO

Width

Height

Box Sizing
border-box
content-box

Min Width

Min Height

Max Width

Max Height
Flexbox

Flex Direction [{"value":"row","label":"row"},{"value":"row-reverse","label":"row-reverse"},{"value":"column","label":"column"},{"value":"column-reverse","label":"column-reverse"}]

Flex Wrap
nowrap
wrap
wrap-reverse

Justify Content [{"value":"normal","label":"normal"},{"value":"flex-start","label":"flex-start"},{"value":"flex-end","label":"flex-end"},{"value":"center","label":"center"},{"value":"space-between","label":"space-between"},{"value":"space-around","label":"space-around"}]

Align Items [{"value":"normal","label":"normal"},{"value":"stretch","label":"stretch"},{"value":"center","label":"center"},{"value":"flex-start","label":"flex-start"},{"value":"flex-end","label":"flex-end"},{"value":"baseline","label":"baseline"}]

Align Content [{"value":"normal","label":"normal"},{"value":"stretch","label":"stretch"},{"value":"center","label":"center"},{"value":"flex-start","label":"flex-start"},{"value":"flex-end","label":"flex-end"},{"value":"space-between","label":"space-between"},{"value":"space-around","label":"space-around"}]

Align Self [{"value":"auto","label":"auto"},{"value":"stretch","label":"stretch"},{"value":"center","label":"center"},{"value":"flex-start","label":"flex-start"},{"value":"flex-end","label":"flex-end"},{"value":"baseline","label":"baseline"}]

Flex Grow

Flex Shrink

Flex Basis
Grid

Grid Template Columns

Grid Template Rows

Grid Column Gap

Grid Row Gap

Justify Items [{"value":"stretch","label":"stretch"},{"value":"center","label":"center"},{"value":"start","label":"start"},{"value":"end","label":"end"}]

Align Items [{"value":"stretch","label":"stretch"},{"value":"center","label":"center"},{"value":"start","label":"start"},{"value":"end","label":"end"}]
Lists

List Style Type [{"value":"none","label":"none"},{"value":"disc","label":"disc"},{"value":"circle","label":"circle"},{"value":"decimal","label":"decimal"},{"value":"lower-alpha","label":"lower alpha"},{"value":"upper-alpha","label":"upper alpha"},{"value":"upper-roman","label":"upper roman"}]

List Style Image none

List Style Position
none
inside
outside
Animation PRORec

Create Animation

Animation Animator [{"value":"none","label":"none"},{"value":"bounce","label":"bounce"},{"value":"spin","label":"spin"},{"value":"flash","label":"flash"},{"value":"swing","label":"swing"},{"value":"pulse","label":"pulse"},{"value":"rubberBand","label":"rubberBand"},{"value":"shake","label":"shake"},{"value":"tada","label":"tada"},{"value":"wobble","label":"wobble"},{"value":"jello","label":"jello"},{"value":"bounceIn","label":"bounceIn"},{"value":"spaceInUp","label":"spaceInUp"},{"value":"spaceInRight","label":"spaceInRight"},{"value":"spaceInDown","label":"spaceInDown"},{"value":"spaceInLeft","label":"spaceInLeft"},{"value":"push","label":"push"},{"value":"pop","label":"pop"},{"value":"bob","label":"bob"},{"value":"wobble-horizontal","label":"wobble-horizontal"},{"value":"bounceInDown","label":"bounceInDown"},{"value":"bounceInLeft","label":"bounceInLeft"},{"value":"bounceInRight","label":"bounceInRight"},{"value":"bounceInUp","label":"bounceInUp"},{"value":"fadeIn","label":"fadeIn"},{"value":"fadeInDown","label":"fadeInDown"},{"value":"fadeInDownBig","label":"fadeInDownBig"},{"value":"fadeInLeft","label":"fadeInLeft"},{"value":"fadeInLeftBig","label":"fadeInLeftBig"},{"value":"fadeInRight","label":"fadeInRight"},{"value":"fadeInRightBig","label":"fadeInRightBig"},{"value":"fadeInUp","label":"fadeInUp"},{"value":"fadeInUpBig","label":"fadeInUpBig"},{"value":"flipInX","label":"flipInX"},{"value":"flipInY","label":"flipInY"},{"value":"lightSpeedIn","label":"lightSpeedIn"},{"value":"rotateIn","label":"rotateIn"},{"value":"rotateInDownLeft","label":"rotateInDownLeft"},{"value":"rotateInDownRight","label":"rotateInDownRight"},{"value":"rotateInUpLeft","label":"rotateInUpLeft"},{"value":"rotateInUpRight","label":"rotateInUpRight"},{"value":"rollIn","label":"rollIn"},{"value":"zoomIn","label":"zoomIn"},{"value":"zoomInDown","label":"zoomInDown"},{"value":"zoomInLeft","label":"zoomInLeft"},{"value":"zoomInRight","label":"zoomInRight"},{"value":"zoomInUp","label":"zoomInUp"},{"value":"slideInDown","label":"slideInDown"},{"value":"slideInLeft","label":"slideInLeft"},{"value":"slideInRight","label":"slideInRight"},{"value":"slideInUp","label":"slideInUp"}]

Condition [{"value":"yp_onscreen","label":"onScreen"},{"value":"yp_hover","label":"Hover"},{"value":"yp_click","label":"Click"},{"value":"yp_focus","label":"Focus"}]

Animation Iteration [{"value":"1","label":"1"},{"value":"2","label":"2"},{"value":"3","label":"3"},{"value":"4","label":"4"},{"value":"5","label":"5"},{"value":"infinite","label":"infinite"}]

Animation Duration

Animation Delay

Animation Fill Mode
none
forwards
backwards
both
Box Shadow

Color transparent
Flat Material Trend Page Colors

Blur Radius

Spread

Position
Outer
Inner

Horizontal Length

Vertical Length
Extra

Filters

Blur

Brightness

Grayscale

Contrast

Hue Rotate

Saturate

Sepia

Transforms

Scale

Rotate

Rotate X

Rotate Y

Rotate Z

Translate X

Translate Y

Skew X

skew Y

Perspective

Opacity

Display [{"value":"block","label":"block"},{"value":"flex","label":"flex"},{"value":"grid","label":"grid"},{"value":"inline","label":"inline"},{"value":"inline-block","label":"inline-block"},{"value":"inline-flex","label":"inline-flex"},{"value":"inline-grid","label":"inline-grid"},{"value":"table-cell","label":"table-cell"},{"value":"none","label":"none"}]

Cursor [{"value":"auto","label":"auto"},{"value":"alias","label":"alias"},{"value":"all-scroll","label":"All Scroll"},{"value":"copy","label":"Copy"},{"value":"crosshair","label":"CrossHair"},{"value":"grab","label":"Grab"},{"value":"grabbing","label":"Grabbing"},{"value":"help","label":"Help"},{"value":"not-allowed","label":"Not Allowed"},{"value":"pointer","label":"Pointer"},{"value":"progress","label":"Progress"},{"value":"text","label":"Text"},{"value":"wait","label":"Wait"},{"value":"zoom-in","label":"Zoom In"},{"value":"zoom-out","label":"Zoom Out"}]

Float
none
left
right

Clear
none
left
right
both

Visibility
visible
hidden

Pointer Events
auto
none

Direction
ltr
rtl

Overflow X
visible
hidden
scroll
auto

Overflow Y
visible
hidden
scroll
auto

Select any element on the page to start making changes.

There is no animation on this page.Select an element to add animation.

Single Customizationemptychanged

Template Customizationemptychanged

Global Customizationemptychanged

Text

Background

Margin

Padding

Border

Border Radius

Position

Size PRO

Flexbox

Grid

Lists

Animation PRORec

Box Shadow

Extra

Documentation / V 7.2.1

Color Scheme

Basic

Font Families

Page Assets

Animations

CSS Selector

General

Classes

Box Model

DOM Code

Dimensions

All Ids

All Classes

There is no animation on this page.Select an element to add animation.

Single Customizationemptychanged

Template Customizationemptychanged

Global Customizationemptychanged

Text

Background

Margin

Padding

Border

Border Radius

Position

Size PRO

Flexbox

Grid

Lists

Animation PRORec

Box Shadow

Extra

Documentation / V 7.2.1

Color Scheme

Basic

Font Families

Page Assets

Animations

CSS Selector

General

Classes

Box Model

DOM Code

Dimensions

All Ids

All Classes

Changes Not Saved. Upgrade To Pro!