Инь Ян ☯︎ символика

( англ. Tamatsukuri Misumaru, яп. 玉造魅須丸 )
Юань Лун:

Дай Гуань (шкатулка)

1920x1080 (правда использовал шкатулку один из его телохранителей)

Наёмник

Бессмертие: Величественные горы и реки:

Му Мин (кит. 木明)

693x1078

Honkai: Star Rail | Myriad Celestia Trailers:

Wuthering Waves:

Jianxin

225x350

youtube

( w i k i )

My Disciples Are All Big Villains:

Lu Zhou

1300x1762 ( w i k i )

и его ученики

Его Преподобие ( англ. Metropolitan Reverence, кит. 都市至尊 ):

Фан Хун

400x533

Шоулин и Циррус

1536x864

Honkai: Star Rail | «Ichor of Two Dragons»:

Дань Хэн

1195x1500

( s h i k i )

Yao Shen Ji:

Director Yang Xin

( w i k i )

Новая легенда о Момотаро:

???

640x480

Возможно, кого-то смутит, что в названии чёрная женская пассивная Инь впереди белого мужского активного Ян. Полагаю, тут дело может быть в том, что у нас читается слева направо, а в китайском — наоборот, справа налево. И видимо из-за того, что мужской Ян встал в конце, весь "инь-ян" стал мужского рода. Однако само написание "инь-ян" не совсем верное. Мы ведь пишем "добро и зло", а не "добро-зло". Так что Инь и Ян — это не оно, она или он, а они. Вместе у них вообще рода нет, только множественное число.
⠀
Любопытный момент — раньше уже была такая коллекция, но бесследно исчезла. Ни в клубе, ни в машине времени Я её не отыскал. По сути, моё свидетельство — единственное доказательство, что она вообще когда-то существовала. Интересно, что будут делать модераторы, если вдруг кто-то решит достать ту коллекцию из "приватных"...

Кроме этой, памагити заполнить другие мои коллекции / "Закусив удела" / Умерли от "кхе-кхе" спойлеры / ККК /, которым пока недостаёт персонажей для публикации. Могу сделать соавтором или даже отдать одну из них, если кто-то пожелает. Но ☯︎-коллекцию не отдам — она ценная (тега на

аniDB нет).
⠀
[ИНТЕРАКТИВ]Испытаем фэншуй на Шикимори. Ваша задача — удерживать равновесие между Добром и Злом. Если, на рубеже весны и лета, лайки👍 и дизлайки👎🏽 у этой коллекции окажутся в идеальном балансе, то в награду Я выложу здесь украшение для профиля — ☯︎-анимацию из чистейшего CSS, без bb-примесей!

РЕЗУЛЬТАТЫ ИНТЕРАКТИВА

⠀
Попытка №1: с результатом 16+ / 16- испытание пройдено!

1898x924 Надеюсь, никто не перенервничал из-за приза, на создание которого у меня ушёл +/- час)

Ровнял на глаз, качества в других браузерах/разрешениях не гарантирую. У меня нормуль смотрится [ firefox / 1920 x 1080 ]

Инь Ян ☯︎ анимация

/* Инь Ян ☯︎ анимация */
#profiles_show .l-page { margin-top: 100px; }
#profiles_show .profile-head:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9998;
  left: 1173px;/* shiki-theme 1149px */
  top: -28px;/* shiki-theme -44px */
  width: 48px;
  height: 24.5px;
  background: white;
  border-color: black;
  border-style: solid;
  border-width: 3px 3px 26px 3px;
  border-radius: 50%;
  animation: 3s Yin_Yang linear infinite;
}
#profiles_show .l-page:after {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1187.5px;
  top: -13.5px;
  width: 6px;
  height: 6px;
  background: white;
  border: 9px solid black;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yin linear infinite;
}
#profiles_show .l-page:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1187.5px;
  top: -13.5px;
  width: 6px;
  height: 6px;
  background: black;
  border: 9px solid white;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yang linear infinite;
}
@keyframes Yin_Yang {
  to { transform: rotate(360deg); }
}
@keyframes Yin {
from { transform: rotate(0deg)
       translate(-12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(-12px)
       rotate(-360deg);
     }
}
@keyframes Yang {
from { transform: rotate(0deg)
       translate(12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(12px)
       rotate(-360deg);
     }
}

Инь Ян ☯︎ анимация (рамка)

/* Инь Ян ☯︎ анимация */
#profiles_show .l-page {
  margin-top: 100px;
  border: 3px solid black;
}
#profiles_show .profile-head:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9998;
  left: 1170px;/* shiki-theme 1146px */
  top: -25px;/* shiki-theme -42px */
  width: 48px;
  height: 24.5px;
  background: white;
  border-color: black;
  border-style: solid;
  border-width: 3px 3px 26px 3px;
  border-radius: 50%;
  animation: 3s Yin_Yang linear infinite;
}
#profiles_show .l-page:after {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1184.5px;
  top: -11px;
  width: 6px;
  height: 6px;
  background: white;
  border: 9px solid black;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yin linear infinite;
}
#profiles_show .l-page:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1184.5px;
  top: -11px;
  width: 6px;
  height: 6px;
  background: black;
  border: 9px solid white;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yang linear infinite;
}
@keyframes Yin_Yang {
  to { transform: rotate(360deg); }
}
@keyframes Yin {
from { transform: rotate(0deg)
       translate(-12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(-12px)
       rotate(-360deg);
     }
}
@keyframes Yang {
from { transform: rotate(0deg)
       translate(12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(12px)
       rotate(-360deg);
     }
}

Пока ждал результатов, совместил ☯︎-анимацию со своими прошлогодними недоделками.

Инь Ян ☯︎ анимация + Волна Ян

/* Волна Ян */
body {
  background: black;
  color: white;
}
.l-page {
  background: transparent;
  mix-blend-mode: difference;
  box-shadow: 0px 0px 0px 5000px white;
}
.smiley {
  background: white;
  height: 40px;
}
/*img.smiley[title=':roll:'] {
  height: 40px;
  content: url('//fl.litclub.net/u/l/lurical/a/65/predstv.gor9.gif');
  padding: 0 2px 0 2px;
}*/
body:before {
  content: ''; pointer-events: none;
  height: 100vh;
  width: 100vw;
  position: fixed;
  z-index: 0;
  background: white;
  animation: Wave_Yang 30s linear infinite;
}
@keyframes Wave_Yang {
from { right: 100vw; }
  to { right: -100vw; }
}
/* Инь Ян ☯︎ анимация */
#profiles_show .l-page { margin-top: 100px; }
#profiles_show .profile-head:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9998;
  left: 1173px;/* shiki-theme 1149px */
  top: -28px;/* shiki-theme -44px */
  width: 48px;
  height: 24.5px;
  background: white;
  border-color: black;
  border-style: solid;
  border-width: 3px 3px 26px 3px;
  border-radius: 50%;
  animation: 3s Yin_Yang linear infinite;
}
#profiles_show .l-page:after {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1187.5px;
  top: -13.5px;
  width: 6px;
  height: 6px;
  background: white;
  border: 9px solid black;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yin linear infinite;
}
#profiles_show .l-page:before {
  content: '';
  position: absolute; z-index: 9999;
  left: 1187.5px;
  top: -13.5px;
  width: 6px;
  height: 6px;
  background: black;
  border: 9px solid white;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yang linear infinite;
}
@keyframes Yin_Yang {
  to { transform: rotate(360deg); }
}
@keyframes Yin {
from { transform: rotate(0deg)
       translate(-12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(-12px)
       rotate(-360deg);
     }
}
@keyframes Yang {
from { transform: rotate(0deg)
       translate(12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(12px)
       rotate(-360deg);
     }
}

Инь Ян ☯︎ анимация (рамка) + Волна Ян

/* Волна Ян */
body {
  background: black;
  color: white;
}
.l-page {
  background: transparent;
  mix-blend-mode: difference;
  box-shadow: 0px 0px 0px 5000px black;
}
.smiley {
  background: white;
  height: 40px;
}
/*img.smiley[title=':roll:'] {
  height: 40px;
  content: url('//fl.litclub.net/u/l/lurical/a/65/predstv.gor9.gif');
  padding: 0 2px 0 2px;
}*/
body:before {
  content: ''; pointer-events: none;
  height: 100vh;
  width: 100vw;
  position: fixed;
  z-index: 0;
  background: white;
  animation: Wave_Yang 30s linear infinite;
}
@keyframes Wave_Yang {
from { right: 100vw; }
  to { right: -100vw; }
}
/* Инь Ян ☯︎ анимация */
.l-page { border: 3px solid white; }
#profiles_show .l-page { margin-top: 100px; }
#profiles_show .profile-head:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9998;
  left: 1170px;/* shiki-theme 1146px */
  top: -25px;/* shiki-theme -42px */
  width: 48px;
  height: 24.5px;
  background: black;
  border-color: white;
  border-style: solid;
  border-width: 3px 3px 26px 3px;
  border-radius: 50%;
  animation: 3s Yin_Yang linear infinite;
}
#profiles_show .l-page:after {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1184.5px;
  top: -11px;
  width: 6px;
  height: 6px;
  background: black;
  border: 9px solid white;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yin linear infinite;
}
#profiles_show .l-page:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1184.5px;
  top: -11px;
  width: 6px;
  height: 6px;
  background: white;
  border: 9px solid black;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yang linear infinite;
}
@keyframes Yin_Yang {
  to { transform: rotate(360deg); }
}
@keyframes Yin {
from { transform: rotate(0deg)
       translate(-12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(-12px)
       rotate(-360deg);
     }
}
@keyframes Yang {
from { transform: rotate(0deg)
       translate(12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(12px)
       rotate(-360deg);
     }
}

Инь Ян ☯︎ анимация (рамка) + Волна Инь

/* Волна Инь */
body { background: white; }
body:before {
content: ''; pointer-events: none;
position: fixed; z-index: 9999;
height: 100vh;
background: white; mix-blend-mode: difference;
animation: Wave_Yin 15s ease-in infinite;
}
@keyframes Wave_Yin {
0% { width: 0%; }
80% { width: 100%; filter: opacity(100%); }
100% { width: 100%; filter: opacity(0%); }
}
/* Инь Ян ☯︎ анимация */
#profiles_show .l-page {
  margin-top: 100px;
  border: 3px solid black;
}
#profiles_show .profile-head:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9998;
  left: 1170px;/* shiki-theme 1146px */
  top: -25px;/* shiki-theme -42px */
  width: 48px;
  height: 24.5px;
  background: white;
  border-color: black;
  border-style: solid;
  border-width: 3px 3px 26px 3px;
  border-radius: 50%;
  animation: 3s Yin_Yang linear infinite;
}
#profiles_show .l-page:after {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1184.5px;
  top: -11px;
  width: 6px;
  height: 6px;
  background: white;
  border: 9px solid black;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yin linear infinite;
}
#profiles_show .l-page:before {
  content: ''; pointer-events: none;
  position: absolute; z-index: 9999;
  left: 1184.5px;
  top: -11px;
  width: 6px;
  height: 6px;
  background: black;
  border: 9px solid white;
  box-sizing: content-box;
  border-radius: 50%;
  animation: 3s Yang linear infinite;
}
@keyframes Yin_Yang {
  to { transform: rotate(360deg); }
}
@keyframes Yin {
from { transform: rotate(0deg)
       translate(-12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(-12px)
       rotate(-360deg);
     }
}
@keyframes Yang {
from { transform: rotate(0deg)
       translate(12px)
       rotate(0deg);
     }
  to { transform: rotate(360deg)
       translate(12px)
       rotate(-360deg);
     }
}

Кто не в курсе, как всё это устанавливается — вот инструкция.

⠀⠀⠀Совместимость со стилями «E-design» и «shiki-theme» (в том виде, как приведено в примере):
На «E-design» легло, как по дефолту; Я аж удивился. А вот пользователям «shiki-theme» придётся поменять пару координат — Я отставил в коде пометки, где и на какие именно.
Тем же из вас, у кого стоят свои собственные примочки, должно быть не хуже меня известно о конфликте повторяющихся свойств у одинаковых селекторов.

⠀⠀⠀

Комментарии

Скрыть 20 комментариев

Показать 20 комментариев

Загрузить ещё 20 комментариев

KEPLOP 4 июня 2024#

@Apc, вот это инь ян, оценки 17 и -17!

/achievements/franchise/yao_shen_ji/level/1/users

Apc 4 июня 2024#

@KEPLOP, Это Я такой челендж на тему коллекции придумал. Глянь шапку, предыдущие комменты...

Apc 7 июня 2024#

I will find you and I will kill you

Эйлеонери Лирейн 8 июня 2024#

Шумэй и Орику

693x1078

Apc 8 июня 2024#

@Эйлеонери Лирейн, М-м, спасибо.

Можешь ещё по этому @комментарию предложить пару(а может и тройку) персонажей; а то у меня уже подгарает, что даже с моей подсказкой никто не может догадаться

Apc 8 июня 2024#

🤬🤬🤬 как же меня 🤬🤬🤬🤬🤬🤬🤬, что из всех персонажей аниме, в базе какого-то 🤬🤬🤬 всегда не хватает именно того одного, который мне нужен!

1439x1079

1304x1080

Судьба/Ночь схватки: Бесконечный мир клинков 2Fate Stay Night Unlimited Blade Works 2nd Season

Apc13 июня 2024#

Ладно, упростим задачу...

Что есть общего на этих двух постерах, и какие три персонажа это "общее" держат?

Судьба/Девочка-волшебница Иллия 2Fate/kaleid liner Prisma☆Illya 2wei!

@Amulvaro, @Clear Foe

Memoka13 июня 2024#

@Apc, я хочу писечку илии.

Apc13 июня 2024#

Clear Foe17 июня 2024#

Apc

именно того одного, который мне нужен

Я смирилась с этим, и просто добавляю в шапку под спойлер. Иногда бывает, что у манги вообще нет персонажей на сайте, так что даже гг нет.

@Apc, мечи? У гг?

@Apc, @Apc

Apc17 июня 2024#

Clear Foe

мечи? У гг?

А-а-а, и как это Я сам не догадался

Всё ж прям на постерах видно было)
Спасибо за наводку

Apc17 июня 2024#

Clear Foe

Я смирилась с этим, и просто добавляю в шапку под спойлер

Я сюда некоторых закидываю...

Clear Foe17 июня 2024#

Apc

видно было)

Так я думала, что это просто загадка от автора, на которую можно ответить.

Но мне, честно говоря, никогда не приходило в голову, что это инь ян, не задумывалась, хотя и постер видела неоднократно.

Apc

сюда некоторых закидываю...

Я закидывала через коллекцию немного, но не персонажей, а мангу / ранобэ. А так, там автор и без меня завален, пока потерплю. Его даже "банили" на мал за чрезмерную активность, правда, к счастью, не из-за персонажей.

Apc17 июня 2024#

Clear Foe

Но мне, честно говоря, никогда не приходило в голову, что это инь ян

Флаг Южной Кореи 🇰🇷 Я тоже считаю за Инь Ян. Надеюсь мне не придётся добавлять сюда слишком много персонажей из-за этого.