I've seen apps with this functionality but not quite sure how to implement it


4 Answers 4


You are looking for a formula field like...

         "Green", "/img/samples/light_green.gif",
         "Yellow", "/img/samples/light_yellow.gif",
         "Red", "/img/samples/light_red.gif", 
         "/s.gif"), "status color")

...more examples of which are found here. No app exchange products or VF necessary.


Yes, the easiest way to get a nice library of icons to use is to install the Graphics Pack app by Labs...


Then, you can simply create formula fields to create and image tag. Your logic in the formula will decide what image to show.

Here is one of the formulas we use in our org to flag cases with either red, yellow, or green based on a formula field that we created to calculate the number of days a case has been open for...

IF(NOT(ISPICKVAL( Status , "Closed")) &&  Days_Open__c > 2, 
IMAGE("https://c.na6.visual.force.com/resource/1348845877000/GraphicsPack/16/fatcow/farmfresh/flag_red.png", "Red Flag" ),
IF(NOT(ISPICKVAL( Status , "Closed")) &&  Days_Open__c >= 1, 
IMAGE("https://c.na6.visual.force.com/resource/1348845877000/GraphicsPack/16/fatcow/farmfresh/flag_yellow.png", "Yellow Flag" ),
IF(NOT(ISPICKVAL( Status , "Closed")) &&  Days_Open__c < 1, 
IMAGE("https://c.na6.visual.force.com/resource/1348845877000/GraphicsPack/16/fatcow/farmfresh/flag_green.png", "Green Flag" ),
IMAGE("https://c.na6.visual.force.com/resource/1348845877000/GraphicsPack/16/fatcow/farmfresh/accept.png", "Case Closed" )

The links to the images can be obtained by browsing the images in the Graphics Pack Overview tab and right clicking to copy the link.

Here's what it looks like in our Case list views...

enter image description here

It takes a bit of time to set it up but it's pretty easy.


This can easily be done in a custom Visualforce page. In the VF page, you can use conditional logic in the style and styleClass attributes to change the background color to match the status.


<apex:page standardController="Account" extensions="caseListController">
        <apex:pageBlockTable value="{!relatedCaseList} var="c">
            <apex:column headerValue="Case No">
                <apex:outputLink value="/{c.id}" target="_blank">{!c.Name}</apex:outputLink>
            <apex:column headerValue="Status" value="{!c.Status}" style="background-color:{!CASE(c.Status,'Closed','#EAE179','New','#ACCC52','Escalated','#C11010')};"/>

with standardController-extension

public class caseListController{
    private final id accountId;
    public list<Case> relatedCaseList {get;set;}    

    public caseListController(ApexPages.standardController con){
            // you have the accountId, so get all the related Cases
            this.relatedCaseList = [SELECT id,Name,Status
                                    FROM Case
                                    WHERE AccountId = :accountId
                                    LIMIT 10000];
    }//END init(ApexPages.StandardController con)

}//END caseListController


"S1" , IMAGE("resource/1386053185000/StageColorPink", "pink",15,15) , 
"S2" , IMAGE("resource/1386053058000/StageColorlightBlue", "lightBlue",15,15), 
"S3" , IMAGE("resource/1386052789000/StageColorBlue", "blue",15,15), 
"S4" , IMAGE("resource/1386051242000/StageColorGreen", "Green",15,15), 
"S5" , IMAGE("resource/1386052820000/StageColorYellow", "yellow",15,15), 
"S6" , IMAGE("resource/1386052658000/StageColorRed", "Red",15,15), 


enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.