Implement reduced color scheme

This is an epic issue that may be broken down into multiple tasks if needed

What should we do?

Cf. our design issue (https://github.com/camunda/camunda-modeler-design/issues/41)

Currently, Camunda Modeler is using an outdated color schema. The latest standard is our cloud color schema with a cold grey palette and primary colors of blue, red, and green. But since there are (too) many different shades available, a reduced schema for the Modeler has been developed.

That needs some alignments in the existing Camunda Modeler architecture.

… some more explanations to follow … break down to follow

• Replace all other color variables in the Modeler CSS with the closest color of the new schema
  • Create a transformation approach for the existing scheme ==> cf. this comment
  • Add new color scheme to Modeler
  • Replace existing color usage with new ones, keep the semantic color variables as is => cf. https://github.com/camunda/camunda-modeler/pull/2539
  • Ensure this scheme also applies for our libraries, too
    • diagram-js - https://github.com/bpmn-io/diagram-js/issues/581
    • form-js - https://github.com/bpmn-io/form-js/issues/192
    • dmn-js - https://github.com/bpmn-io/dmn-js/issues/663
    • bpmn-js - https://github.com/bpmn-io/bpmn-js/pull/1519
    • <del>properties-panel</del> ==> already covered
    • dmn-js-properties-panel - https://github.com/bpmn-io/dmn-js-properties-panel/issues/27
• Use --color-grey-225-10-15 as standard for UI texts
• Use --color-grey-225-10-35 as standard for icons, symbols, etc.

Why should we do it?

That’s part of our one Visual IDE efforts. A unified color palette ensured a unified look & feel.

Cf. https://github.com/camunda/camunda-modeler-design/issues/41

[pinussilvestrus]

I decided to not touch the bpmn-js-properties-panel colors for now, since we will update the library soon, anyway.

[pinussilvestrus]

All sub-tasks are closed, therefore let’s close the issue.