# Dropdown list styling

**URL:** <https://forum.inductiveautomation.com/t/dropdown-list-styling/103942>\
**Category:** Ignition\
**Tags:** vision, ignition81\
**Created:** [March 20, 2025, 12:27pm UTC](https://forum.inductiveautomation.com/t/dropdown-list-styling/103942 "2025-03-20T12:27:50Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![justinedwards.jle](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/justinedwards.jle/32/37854_2.png) [@justinedwards.jle](https://forum.inductiveautomation.com/u/justinedwards.jle)\
**Post date:** [March 20, 2025, 1:37pm UTC](https://forum.inductiveautomation.com/t/dropdown-list-styling/103942/2 "2025-03-20T13:37:49Z")

</div>

It can be done by implementing a custom `ComboListCellRenderer`.

**Example:**

```python
# Run once at initialization
# Preview mode has to be active prior to opening the window for this event to occur in the designer
if event.propertyName == 'componentRunning' and event.newValue:
	from com.inductiveautomation.plaf import ComboListCellRenderer
	
	# Create a custom cell renderer implementation for coloring the dropdown rows
	class ColorCellRenderer(ComboListCellRenderer):
		def getListCellRendererComponent(self, list, value, index, isSelected, cellHasFocus):
			ComboListCellRenderer.getListCellRendererComponent(self, list, value, index, isSelected, cellHasFocus)
			# active row highlight
			if cellHasFocus or isSelected:
				self.background = event.source.selectionBackground
				self.foreground = event.source.foreground
			
			# conditional coloring
			elif index != -1:
				online = event.source.data.getValueAt(index, 'Online')
				self.background = system.gui.color('green') if online else system.gui.color('red')
				self.foreground = system.gui.color('white') if online else system.gui.color('yellow')
			return self
	
	# Repalce the dropdown's stock renderer with an instance of the custom implementation
	event.source.setRenderer(ColorCellRenderer())

```

**Result:**

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/c/7cfbab2c1708a75de8156cc46649588d9d7a87ca.png)

Here are some other forum examples for reference:  
• [Listbox Foreground-or Background Dynamic Color Change via Python](https://forum.inductiveautomation.com/t/listbox-foreground-or-background-dynamic-color-change-via-python/89925/2)  
• [A color picker component for Vision](https://forum.inductiveautomation.com/t/a-color-picker-component-for-vision/6779/5)  
• [Change the background and icon color of the Dropdown Component's button](https://forum.inductiveautomation.com/t/change-the-background-and-icon-color-of-the-dropdown-components-button/70617/2)

---

_[View the full topic](https://forum.inductiveautomation.com/t/dropdown-list-styling/103942)._
