Amabie Labo

OBSでピコピコを楽に生成ツール

使い方

データの安全性について

サポート

2023年10月22日現在以下のバージョンで動作が確認できています。
OBS のバージョン：29.1.3
Discord のバージョン：Stable 239004 (405d7a8)

OBS や Discrod に更新が入っていて動作しない場合は 𝕏 か Threads で連絡してください！
また、久々にこのサイトを開いた方は下の方の [CSSをリセットする] のボタンを押してリセットすることを推奨します！（古いデータを削除するためです）

新規

登録済み

プレビュー

　幅：px

高さ：px

生成コード

自由に編集可能です。

ただし、IDを入れるところは「##ID##」、画像URLを入れるところは「##URL##」と書いてください

/* 選択したユーザ以外の画像を非表示にする */
img:not([src*="##ID##"]){ display:none; }
img:not([src*="##ID##"])+div{ display:none; }
li{ position:fixed;top:15px;left:0;right:0;width:100%; }
[class*="Voice_voiceStates__"] {
  display: flex;
  flex-direction: column;
}
[class*="Voice_voiceState__"] {
  display: flex;
  height: initial;
  margin-bottom: 0;
}
[class*="Voice_avatar__"] {
  content:url(##URL##);
  width:100% !important;
  height:auto !important;
  border: none !important;
  filter: brightness(70%);
}
[class*="Voice_avatarSpeaking__"] {
  position: relative;
  filter: brightness(100%);
  animation: 750ms infinite alternate ease-in-out speak-jump;
  animation-duration: 750ms;
}
@keyframes speak-jump {
0% {
  bottom: 0px;
}
50% {
  bottom: 10px;
}
100% {
  bottom: 0px;
}
}
@keyframes speak-border {
0% {
  filter: drop-shadow(2px 2px 0px #FFFFFF) drop-shadow(-2px -2px 0px #FFFFFF) drop-shadow(-2px 2px 0px #FFFFFF) drop-shadow(2px -2px 0px #FFFFFF);
}
50% {
  filter: drop-shadow(2px 2px 0px #FFFFFF) drop-shadow(-2px -2px 0px #FFFFFF) drop-shadow(-2px 2px 0px #FFFFFF) drop-shadow(2px -2px 0px #FFFFFF);
}
100% {
  filter: drop-shadow(2px 2px 0px #FFFFFF) drop-shadow(-2px -2px 0px #FFFFFF) drop-shadow(-2px 2px 0px #FFFFFF) drop-shadow(2px -2px 0px #FFFFFF);
}
}
/* ネームタグ表示位置調整 */
div[class*='Voice_user']{text-align:center; position:fixed; bottom: 10px; left:0;right:0;margin:auto; }
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }

< 戻る