Hi, since you did not give a link to your site, I’ve had to go off of the Revelar demo site. The originals are Genericon font icons.
This is the base for standard posts.
.entry-format::before {
background-color: #dde4e6;
border-radius: 50%;
color: #fff;
content: '\f100';
display: block;
font-family: "Genericons";
font-size: 34px;
font-size: 3.4rem;
padding: 0 .4em;
text-shadow: 0 0 1px #aaa;
}
Then the following would be for the different post formats.
.format-gallery .entry-format::before, .blog.home .hentry.format-gallery .entry-thumbnail.no-thumbnail::before {
content: "\f103";
}
.format-quote .entry-format::before, .blog.home .hentry.format-quote .entry-thumbnail.no-thumbnail::before {
content: "\f106";
}
.format-image .entry-format::before, .blog.home .hentry.format-image .entry-thumbnail.no-thumbnail::before {
content: "\f102";
}
.format-link .entry-format::before, .blog.home .hentry.format-link .entry-thumbnail.no-thumbnail::before {
content: "\f107";
}
.format-video .entry-format::before, .blog.home .hentry.format-video .entry-thumbnail.no-thumbnail::before {
content: "\f104";
}
.format-aside .entry-format::before, .blog.home .hentry.format-aside .entry-thumbnail.no-thumbnail::before {
content: "\f101";
}
If you are wanting to use images, you can add urls to the content declarations. See here for more information on that.
On the sizes, if you are going to use images, I would suggest you keep them around about 36px square so that they will fit well in the existing icon circular background.