How to make a Pill Form Field in Google Sheets

Intermediate

About this Tutorial

Create rounded pill form fields in Google Sheets.
Using Canva and a bit of a transparent PNG hack, you can make these very easily too!

also make sure to check out Coupon Code Maker a software product I sell that generates thousands of coupon codes in a click.

Recently updated dashboard makes it really cool!

Sheet Resources

Access Sheet

Copy Sheet

Preview Sheet

Video Transcript

<div>0:01 So you want to know how I make these pill form fields . So, if you can see where I'm at right now. 0:08 Actually, I'll zoom in. Uhm, this looks cool, right? Like there's some rounded corners and stuff. And these pill forms specifically are really cool. 0:16 But, as you can see, I'm highlighting one cell and it's the thing on the left and the right that makes it this pill form. 0:21 But it, essentially, if I delete those, it is just a regular cell. I did some coloring. I obviously did a file, a view. 0:32 Show and I took out grid lines. Okay, that was one big thing.

And I made the, uhm, background and foreground, like, different colors so it looks like a little indent, right? 0:41 But, like, this pill stuff is really cool, right? So here's how I do it. Go to Canva.com Yeah, it's Canva. 0:49 Create a design. We're going to create a new design, custom size. We're going to do 5,000 by 5,000 pixels. Uhm, don't necessarily have to do that big, but I do. 0:59 We're going to go to Elements, Circle. We have a shape here.

We're going to make sure we have the right color, so I'm going to make it this color of this grey here. 1:11 So let's get that color hex code, and here's the actually interesting part. Get a color hex code from Google Sheets. 1:18 We have it selected already, right? This is the correct one here, but we're going to go click on add custom color, we're not going to add a custom color, we're just going to get the hex code, and there's the hex code. 1:29 It's, it's hashtag 66666, that's what it is here, so we're going to get that 66666.

We can remember it, but also we can copy paste. 1:36 Go back to our design, we're going to make sure that the color of the shape is 66666. Again, we can copy paste it, we don't have to remember, maybe it's like very complicated if it's something actually custom. 1:48 Okay, we have a circle, but we only need half of this circle.

So if we make the size of the circle actually first let's, before we do the size, let's get it right there on the center. 2:01 So it, I don't know if you saw it, but it snapped a little bit, it's a little uhm hard to do, but it can snap to the center piece of the shape on the edge. 2:11 Now we just need to get the size correct. And so I'm gonna actually get it center and center, so center on the side and cen- and vertically as well. 2:20 I'm gonna hold down option, this is like sort of the hard part, hold down option.

And then I'm gonna get the size to be right up against the edge, right here. 2:29 Uhm, you're gonna see some interesting stuff and I've played around with this a little bit. There's some little weird things you can do. 2:36 You can add a border if you want, but I don't know if that really helps or not. But we don't, we actually make sure, let's make sure we have no border, no border, no corner rounding, nothing. 2:45 And here's the trick. Let's call it something gray new gray circle. We'll call it right.

We're going to download, but make sure you do transparent background. 3:01 That is another trick here. Okay, click download. We're going to download that. Then we're going to go back to our sheet. 3:08 I'm going to click the cell that I want next to it, where I want the pill. Wait, we got the right side. 3:13 So, I actually want to go on the right side of the, of the form field . I'm going to do insert image , and in this case, we're going to do image insert set, insert image in cell. 3:24 Okay, we can go over to our downloads and click and drag.

You can probably see the other ones I did here. 3:31 Insert that image here. What will it look like? It looks perfect, right? But it might not look perfect to you for yours. 3:40 What you're going to have to make sure you do is if the width of your cell that it is in is, let's see, too big, doesn't matter, but if it's too small, you'll see the size of that image gets really tiny. 3:54 So what, if this occurs, just make the width of the cell wider, okay?

You can see the ones down here also have some issues, so I'm going to make this a little bit wider. 4:05 Uhm, actually I think I'm going to make this the same, let's look at, let's look at the size of this resize column , it's 50. 4:14 Okay, let's make sure this is 50 as well.

Resize column , that's 53, so make sure it's 50, okay, and for the left side, let's do this again, we can actually copy this and move, we have the same, the right side, we just have to move it to the right, and I don't know if you can see, right here, it's showing 4:39 up that it's snapping, that's the key we gotta snap, and this is the left side, we can also call this left. 4:49 If we want, share , I don't need to copy the link, why did I click that, download, transparent background is on, cool, okay, back to our sheet, insert. 5:04 Image into cell again, and this is boring because you already know how to do it where 's the downloads, oh, download was a, now it's a zip file because it's more than one, okay, let's see, we want the left one, put that in, and it should look perfect right away because we have the right, right width and 5:26 the right size, should look perfect right away, perfect, the other button here generate actually is a whole image , it's a drawing , oh no, it's actually, I think it is a canva, still canva with a png, but uhm that's different, different rounding, what I would suggest, okay, if you're watching this video 5:38 all the way through, I would suggest something different than I did, I would suggest all of your uhm rounded corners all are the same, I think literally every rounded corner is different here, I think it's a round, different rounded corner at the edge here. 5:52 Here, here, and here, oh I don't need to click that, but what we did here, if we, if you want to know, is we inserted this image over the cells and then we added an assigned script, so if you're looking at this and you're like, what is this dashboard, actually, it's coupon code maker, go check it out 6:08 .

I actually put up a YouTube video and a beta sheets update for this, this is like the new dashboard for coupon code maker, it generates thousands of coupon codes in one click, you can generate like one thousand here, if you want, I have five here, but yeah, I think I thought this would be a cool video 6:25 to share with you how to do this uhm sort of pill looking form field , uhm it takes a lot of work, right, uhm but I think it adds so much more, this really doesn't look like a Google Sheet, doesn't feel like a Google Sheet, even though it is a Google Sheet, that's awesome, alright, bye.</div>