Recently I completed work on a website that featured a lot of elements with lines tilted 30 degrees from the vertical. That site is Vaba Design, the new home of my professional portfolio, of which more anon. Seeking fun ways to echo that theme in as many design elements as possible, I hit upon the following method for transforming the bullets from an unordered list into 30 degree parallelograms, without using images.

ul li {
  list-style: none;
}
ul li::before {
  transform: skewX(30deg);
  content: "\25aa";
  display: inline-block;
  width: 1em;
}

The content line above inserts a Unicode character, in this case U+25AA or “Black Small Square” before the rest of the line. That gets skewed into a parallelogram with the transform declaration. Depending on other things like fonts and colors, it could look like this:

This works pretty well except if your list item overflows a single line, in which case the second line won't indent as you might want. It will start at the beginning of the bullet instead of starting where the text of the first line starts. But if that's not a problem for you, give this method a try.