Я сделал через пейнт разными частями а через css генерировал сборку локации...
Так как я не занимаюсь графику но ради бесплатного сделал сам себе.

Уже сделал:
- Проход в другой локации
- Стена
- Блокировка проход

планирую сделать:
- Иконка монстра в центре локации
- Иконка сундука в центре локации
- Нпц квест знак и диалог

Так как я его потихонку изучал... (Не суди что они простые) Я ради себя делал и поделил.

Так как карта будет иметь скролинг при тыкание локации может дратся или диалог с нпц и так далее!

Хм чет не нашел где эффект бордера свечение хатухание и появление...

А все нашел


@-webkit-keyframes pulsate {
50% { box-shadow: 0 -1px rgba(0,0,0,.3), 0 0 5px #ffd, 0 0 8px #fff; }
}
@keyframes pulsate {
50% { box-shadow: 0 -1px rgba(0,0,0,.3), 0 0 5px #ffd, 0 0 8px #fff; }
}

.location:hover {
border-radius: 5px;
box-shadow: black 0 0 1px,
rgb(245, 236, 236) 0 0 1px,
black 0 0 1px,
black 0 0 1px,
black 0 0 1px;
-webkit-animation: pulsate 0.8s linear infinite;
animation: pulsate 0.8s linear infinite;
}


Шас рисую череп:
- Белый (Монстр)
- Синий (Усилений монстр)
- Желтый (Легендарный монстр)
- Красный с коронами (Босс)

Мы рады за тебя

Хд какой ужасный череп =)

босс

хм

Понетрировал сделал пока белый череп и корона 2 слоя