I call them "tag blocks" but I don't think that's correct. The pattern is a block of textual information with the X to remove it. It can be seen in some places after adding a file to let you remove the file.
They receive many names depending on the script you use, there seems NOT to be a consensus on a single specific name. Just to illustrate different options, here you have the names and link to the script that generates these blocks.
There seems to be some kind of consistent naming around the tag and select terms, however it's not definitive. Furthermore, since most of these plugins (if not all) use JQuery and "selector" is a totally different thing in JQuery (and HTML5) while select is even more confusing, I guess something like tag box would be the more appropriate option. Personally, I call them closable terms boxes
These are not tags
To be clear: these are not tags, nor are these select, these are not boxes, these are not selectors. All of this terms have very specific definitions, none of them apply to the question entirely, only in part.
Furthermore, this element is NOT always a tag, it could be a category, or a custom taxonomy or a live search term.
Anatomy of element
This element is composed of at least 3 different sub-elements: a visual one, a taxonomy/IA one and an action one.
The visual one is the box or boundary that contains the tag or filter term plus the close element, the taxonomy one is the term itself (eg, a tag), and the action one is the close element and in some cases, a handle to drag an re-arrange.
Functionally, it's an input element if you work with autocomplete search or the likes, but if the terms were added by an admin, they are select since the user can only select from a pre-defined list of terms.
As said above, there's no consensus about it. If you're looking to properly communicate this element to someone, it's reasonable to call them by combining 2 or more of the compounding parts
Material design called them "Chips". https://material.io/guidelines/components/chips.html
Before flat design became in vogue, during the heyday of gradients, drop-shadows and reflections, tags wrapped inside round cornered rectangles were often referred to as Lozenges in certain circles. This term was a way to distinguish between a button and a list of tags which are clickable. That said, I've not heard the term mentioned in the last couple of years.
Buttons? There's no specific term for it. The first example are tags. The second are filters. They just happen to be styled as buttons/boxes.
UPDATE: Joe makes me realize that what these are called would depend on what we're talking about.
- Individual words or phrases to provide meta-data to content: tags
- Terms used to reduce a search data set: filters
- An 'x' to delete an item: delete?
- A visual box you can interact with: button?
I'd say your images are examples of (functionally) tags and filters that can be easily dismissed with the delete icon and (stylistically) displayed as buttons :)
I don't know if there's a particularly well established terminology for them, but I've generally heard them referred to as pills.
The naming confusion comes from the fact that the most common use for the pill UI pattern is to represent tags. It's easy to spot why folks would drift to using the common usage to describe the pattern. Pills work really well for tags, but they work really well for other things too - Emails, IP addresses, etc...
So, "pill" or "pill input" is the ui pattern that's often used to provide tagging capability, but which can be used for other things too.