lc_color_*

Change element colors dynamically based on specific values, conditions, or data-driven logic.


Element Setup

Target Element:

  • Element type: Any SVG element (<rect>, <circle>, <path>, <polygon>, etc.)
  • ID format: lc_color_* (e.g., lc_color_status, lc_color_indicator)

Input Format

Hex: "#2196F3"
CSS names: "royalblue", "green", "orange"
RGB: "rgb(33, 150, 243)"


Usage Example

<!-- In your SVG -->
<rect id="lc_color_status" width="100" height="100" fill="#ccc" />
<circle id="lc_color_indicator" cx="50" cy="50" r="20" fill="#000" />

<!-- In your dataset -->
{{ status }} = "#4CAF50"  <!-- Green for success -->
{{ indicator }} = "red"    <!-- Red for alert -->

Common Use Cases

Status indicators, performance colors, priority levels, sentiment analysis.

← Back to Custom Overview


This site uses Just the Docs, a documentation theme for Jekyll.