How to change the color of the online text on my profile

To my knowledge, you would have to change both the text and icon together. I did it by having two images with a blinking animation: the text is on both images while the icon is on one of them. Mine was done on a drawing program with 2 different layers exported as PNGs. Then, I uploaded them to an image hosting website to get the URL.

I found the CSS code for the blinking animation for the status from a layout. I probably got the @keyframes from another layout but I can't remember. This CSS rule was featured in this popular layout. 

.online{height: 39px; 
width: 83px; 
animation-name: blink;
animation-iteration-count: infinite; 
animation-timing-function: cubic-bezier(1, 0, 0, 1); 
animation-duration: 2s;}
@keyframes blink {from {content:url("FIRST IMAGE with icon and text");} to {content:url("SECOND IMAGE with text only");}}

You can change the height & width to however you wish. The animation timing function seems to be between 2 states: second image (1) and first image (0). You could change the pattern on how they blink, but this is the default blinking animation on SpaceHey statuses. animation duration is 2 seconds is the time in between each image.

Right-click --> Inspect is also very helpful when knowing which CSS element to modify. You right-click --> Inspect wherever on your profile, and it'll highlight the location of the element in the HTML. This code modifies .online