Question

I’m trying to recreate the following font style in code:

Upon looking closely, you will notice a lot of small details about this style. The style was made in photoshop with the following settings:

• A white drop shadow for the highlight, 18% opacity, 2px size
• A black inner glow at the top for recessed look with 2px size
• A purple inner glow with hex color: #fd32ff at 28% opacity and 4px size

To recreate the drop shadow, I simply plan on setting the UILabel (which will contain the font) to have a drop shadow and color, like so:

myLabel.layer.shadowColor = [UIColor whiteColor].CGColor;
myLabel.layer.shadowOffset = CGSizeMake(0.0, 2.0);

Combining that with black font gets me somewhat close to the desired look…

Can anybody give me any tips to point me in the right direction for recreating that purple glow effect in code? Do I need to override draw rect for drawing the label and do something in there?

Answer 1

This is pretty specific stuff… but in case anybody else wants to recreate this font, this is about as close as I got.

You’ll have to get access to ProximaNova fonts and add them to your project as well.

My solution to get 3 colors was to use 2 labels, one label implementing the “top two” colors, and one label implementing the last bottom color (white, in this case).

    UILabel *whiteDocumentNameLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 300, 35)];
    whiteDocumentNameLabel.backgroundColor = [UIColor clearColor];
    whiteDocumentNameLabel.textAlignment = UITextAlignmentCenter;
    whiteDocumentNameLabel.font = [UIFont fontWithName:@"ProximaNova-Bold" size:24];
    whiteDocumentNameLabel.text = @"MyText";
    whiteDocumentNameLabel.textColor = [UIColor colorWithRed:1 green:1 blue:1 alpha:.18];

    UILabel *documentNameLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, -1, whiteDocumentNameLabel.frame.size.width, whiteDocumentNameLabel.frame.size.height)];
    documentNameLabel.backgroundColor = [UIColor clearColor];
    documentNameLabel.textAlignment = UITextAlignmentCenter;
    documentNameLabel.font = whiteDocumentNameLabel.font;
    documentNameLabel.text = whiteDocumentNameLabel.text;;
    documentNameLabel.textColor = [UIColor blackColor];
    documentNameLabel.layer.shadowColor = [UIColor colorWithRed:253.0 / 255.0 green:50.0 / 255.0 blue:255.0 / 255.0 alpha:1].CGColor;
    documentNameLabel.layer.shadowRadius = .75;
    documentNameLabel.layer.shadowOpacity = .2;
    documentNameLabel.layer.shadowOffset = CGSizeMake(0, 0);
    [whiteDocumentNameLabel addSubview:documentNameLabel];