[hideprofile][html]

<!--- Цвета кастомизируются. Во всём шаблоне использованы всего четыре цвета за редкими исключениями. Просто укажите вместо цвета типа #af8c65 тот, который по вкусу вам. Экспериментируйте и сделайте свою страничку уникальной!  --->
<style>
:root {
    --main-color: #000000;
    --2nd-color: #8c8c8c;
    --3rd-dark-color: #101112;
    --light-and-text: #cdcdcd;
}

.vf-name::before {
    background: linear-gradient(146deg, rgb(54 52 52) 14%, #202020 48%, var(--main-color) 117%)!important;
}

.vf-video-list a.active {
    color: #cdcdcd!important;
}

.vf-menu>div:hover {
    background: #be002d !important;
}

</style>

<!--- Разметка начинается отсюда --->
<section class='void-feed-wrapper'>
<div class='void-feed-logo' />
<div class="vf-menu">
    <!--- То, что внутри кавычек в атрибуте data-self и само название кнопки можно менять --->
    <div class="vf-main" data-self='//data_about_me'>Profile</div>
    <div class="vf-photos" data-self='//data_some_photo_shit'>Photos</div>
    <div class="vf-music" data-self='//data_a_bit_of_music'>Music</div>

</div>

<div id="main-content" class="vf-tab-content vf-prof">
<div class='vf-aboutme-wrapper'>
<!--- шапка личной странички --->
<div class='ep-wrapper'>

<!--- Параллакс настраивается. Первая в списке картинка — фон. Остальные — png. Вы можете менять их как вам захочется. Если хочется статичной картинки — удалите все, кроме единственной и сотрите у неё атрибут data-speed="0.01" --->
<img class='parallax vf-custom-head' data-speed="0.01" src='https://i.imgur.com/eqd0CMU.png' >
<img class='parallax vf-custom-head' data-speed="0.02" src='https://i.imgur.com/ACOcNHu.png' style="height: 170px;">
<img class='parallax vf-custom-head' height=400 data-speed="0.03" src='https://i.imgur.com/QaUGy87.png' style="height: 200px;">

</div>

<!--- аватар --->
<div class='vf-custom-avatar'><img src='https://i.imgur.com/xOBli3K.png'></div>

<!--- личные данные --->
<div class='vf-personal'>
<div class='vf-name'>Aranami Sakado</div><!--- Имя персонажа--->
<a class='vf-agent' href='https://edgezone.rusff.me/viewtopic.php?id=260#p25635'>@storm</a> <!--- любой подходящий на ваш вкус аватар (его можно менять, просто редактируя первое сообщение в теме с этим вот блоком --->
<div class='vf-status'>No man can have everything he wants the way that he wants it </div> <!--- Статус (на 150-200 символов) --->

</div>
<div class='vf-about'><div class='vf-about-visual'>

<!--- Персональные данные. Можете менять текст внутри data-aboutme, добавлять свои дополнительные контейнеры и писать столько текста, сколько хотите. Пунктов может быть сколько угодно, просто на определённом этапе они начнут прокручиваться --->

<div data-aboutme='Date of Birth'>27 05 2048 </div>
<div data-aboutme='Afilliation'>Арасака, Тигриные Когти</div>
<div data-aboutme='Primary Weapon'>Катана 17 века, Fūryū</div>
<div data-aboutme='Secondary Weapon'>Клинки богомола</div>
<div data-aboutme='Auxiliary Weapon'>Весь остальной мир</div>
<div data-aboutme='Combat Style'>Да, я прихожу на перестрелки с холодным оружием. Но это не мои проблемы.</div>
<div data-aboutme='Hobby'>Пейзажные фото в моменте</div>
<div data-aboutme='Additional Interests'>Книги, поэзия, классическая музыка, ультранасилие.</div>

</div></div></div></div>
<div id="photos-content" class="vf-tab-content" >
<div class='fr-common-cont'><div class="vf-photos-data">

<!--- Просто надо вставить ссылку на фото с любого подходящего файлообменника. Надо добавить фото? Просто копируйте строку ещё раз. И ещё раз. --->

<img class="vf-pers-photo" src="https://i.imgur.com/QjKKDW4.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/U9Ot3nJ.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/6LgAwMx.png"  alt="Photo">

<img class="vf-pers-photo" src="https://i.imgur.com/rmLCUXv.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/12ihkN7.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/rlPXdqF.png"  alt="Photo">

<img class="vf-pers-photo" src="https://i.imgur.com/HLsYq9z.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/1J9wouZ.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/TDNj6dC.png"  alt="Photo">

<img class="vf-pers-photo" src="https://i.imgur.com/gwbyyFX.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/cSeTEym.png"  alt="Photo">
<img class="vf-pers-photo" src="https://i.imgur.com/AJC8TG6.png"  alt="Photo">

<img class="vf-pers-photo" src="https://i.imgur.com/DJrV5Ae.png"  alt="Photo">

</div>
</div>
</div>

<div id="music-content" class="vf-tab-content"><div class='fr-music-cont'>

<!--- Вот тут ничего трогать не надо --->
<div class="vf-video-player">
    <iframe id="vf-youtube-player" width="560" height="315" src="" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
<div class="vf-video-list">

<!--- Список музыкальных ссылок. РАБОТАЕТ ТОЛЬКО С YOUTUBE! Вам надо просто вставить в атрибут data-video-id код из ссылки видео на youtube. Ссылок может быть любое количество --->

    <a href="#" data-video-id="S_v172PgToE">Black Sun Empire - Arrakis</a>
    <a href="#"  data-video-id="KTkhf8-39aU">Black Sun Empire & State of Mind ft. Virus Syndicate - Caterpillar (instrumental)</a>
    <a href="#" data-video-id="PfPibO3lkaA">Ilan Eshkeri & Shigeru Umebayashi - Shurai</a>
    <a href="#" data-video-id="qQaaV4slPPE">Pythius - Akkoord (ft. June Miller)</a>
    <a href="#" data-video-id="pGI3ecxbLx0">首輪を破壊されてショックを受けるうに</a>
    <a href="#" data-video-id="oXnB4n036_Q">Połoz & Łotr - Memories of Mzuzu</a>
    <a href="#" data-video-id="SxAOClAa1Ko">V. Seiiki</a>

</div></div></div>

<!--- Этот блок нужен, если вы желаете добавить четвёртую вкладку. Его можно клонировать бесконечно и заполнять своим контентом. Если не нужен — просто удалите. Не забывайте: в комплекте с этим блоком обязательно нужна кнопка в меню выше. Частично работают бб-коды — размер шрифта, центр/справа/слева, жирный, курсив. Абзацы делаются с помощью <br> --->
<div class="vf-tab-content" ><div class='fr-custom-cont'>Кастомная кнопка<br>

</div></div>

<div class='void-feed-footer' />

<!--- ОФОРМЛЕНИЕ --->
<!--- Надписи внутри контейнеров можете менять на те, что хочется --->
<div class='fr-anim fr-flicker fr-anim-first' >//content_data_undefined</div>
<div class='fr-anim fr-anim-second' >//content_({foo})_display</div>
<div class='fr-anim fr-flicker fr-anim-third' >//data: TRN_VINODE_935081</div>
<div class='fr-anim fr-anim-fourth' >TRN_TCLASS_800095</div>
<div class='fr-anim fr-blur-out fr-anim-fifth' >VER_M6A6T64</div>
</section>[/html]

Подпись автора

подпись с картинкой в правом углу
КАРТИНКА