Overview
Developed using only CSS and HTML, these blockquotes examples offer a nice way to show off your site's accent color(s) without much extra work.
By using the natural breakpoints in the
border
and changing the
width
of the "negative space", I was able to create two nice angled versions.
But How?
This is made possible by giving
border-bottom
and
border-top
the exact same color as
background-color
, creating a simulated angle that would otherwise be hard to achieve on such a narrow width.
I'm sure I cannot be the only one to have thought of this idea, but I have not yet come across it so I am quite proud to take credit for this version of the concept at least. πππ
Usage
Of course, anyone is free to use it or find ways to improve it. Just put a link back in the comments, please!
Don't forget to π this article and/or leave a π. Even better, you can click my name below to πsubscribeπ!
Until next time...
-- killshot13