Jump to main content Jump to doc navigation

lighten is an Output Modifier that accepts a hex value and percentage (+ or -) option. Additionally, 'max' or 'rev' can be set as an option, with or without a percentage.

Examples:

[[+color:lighten=`20`]]

Result: lightens the $input hex color by 20%

[[+color:lighten=`-30`]]

Result: darkens the $input color by 30%

[[+color:lighten=`max`]]

Result: if the $input value is above the $threshold value, 'ffffff' will be returned, else '000000' will be returned. The $threshold value can be defined in the Snippet properties.

[[+color:lighten=`rev60`]]

Result: this would output the reverse of the $input hex (white or black) at 60% (so it'd be more of a medium grey in this case)

Support the team building MODX with a monthly donation.

The budget raised through OpenCollective is transparent, including payouts, and any contributor can apply to be paid for their work on MODX.

Backers

  • modmore
  • STERC
  • Digital Penguin
  • Jens Wittmann – Gestaltung & Entwicklung
  • Fabian Christen
  • Dannevang Digital
  • Sepia River Studios
  • CrewMark
  • Chris Fickling
  • deJaya
  • eydolan
  • Lefthandmedia
  • Murray Wood
  • Following Sea
  • Anton Tarasov
  • Stéphane Jäggi
  • Raffy
  • Snow Creative
  • A. Moreno
  • Nick Clark
  • JT Skaggs
  • Helen
  • YJ
  • krisznet
  • Richard
  • Yanni

Budget

$306 per month—let's make that $500!

Learn more