Kürzlich hat Janitor AI seine Klassennamen und die zugehörigen CSS-Stile aktualisiert, was Bots-Biografien und Beschreibungen betrifft.

Die aktualisierten Klassennamen und CSS-Selektoren, die in diesem Beitrag geteilt werden, wurden durch Inspektion des Front-End-Quellcodes von Janitor AI mit den Browser-DevTools ermittelt. Sie werden ausschließlich für kosmetische Gestaltung und kreative Anpassung durch die Community bereitgestellt.

Diese Klassennamen sind weder offiziell dokumentiert noch von Janitor AI unterstützt und können sich nach einem Website-Update jederzeit und ohne Vorankündigung ändern oder fehlerhaft werden.

Diese Informationen werden nur zu Lern- und kreativen Zwecken geteilt.
Es wurden keine proprietären Daten, Nutzerdaten oder Kontozugangsdaten abgerufen oder extrahiert.

Dies ist in keiner Weise mit JanitorAI und seinem Team verbunden, von diesem unterstützt oder genehmigt.

i Wenn du Schwierigkeiten hast, die Codes in die Charakterkarte einzubinden, empfehle ich dir, einen Blick auf Rockets Anleitung zu werfen – sie ist eine deutlich detailliertere visuelle Anleitung, die tiefer geht als die am Ende dieses Bots.

Falls Probleme bestehen bleiben, frage gerne im J.AI-Discord nach, da ich von meiner Seite aus nicht viel mehr tun kann.

Häufig verwendete:

div _characterInfoMarkdownContent_123vi_223

_input_jv6cc_126

Suche derzeit nach weiteren.
Diese Liste wird laufend aktualisiert, sobald neue Klassennamen entdeckt werden. Schau später wieder vorbei.

• ~101 Klasseneinträge
  

• 2026-28-04
  - 4+ Klassen dank permanent aktualisiert
  - Liste von A–Z sortiert
  

• 2026-29-04
  - Hinzugefügt <p class="class_name"></p> Zum Persönlichkeitsabschnitt
  - Definition geöffnet
  

• 2026-30-04
  - _card_13n8k_2 aktualisiert
  - _cardTitle_13n8k_402 hinzugefügt
  

• 2026-01-05
  - Veraltete Klassen entfernt
  ( _viewAllStandalone_mi467_68, _segmentActive_kwwol_63, _segmented_kwwol_51, _content_1chl9_11, _characterMenu_128g5_496, _count_kwwol_25, _count_mi467_31)
  

• 16.05.2026
  - Geänderte Klassen aktualisiert
  ^Nochmals Dank an permanent(puppy)^
  

• 2026-19-10
  - Veraltete Klassen entfernt
  - Ersatzklassen aktualisiert

A

_appModalBadge_xxqvx_134

_appModalContent_xxqvx_85

_appModalCta_xxqvx_195

_archiveButton_di476_217

_autoResizeTextarea_mrqt8_1

B

_banner_2x3bf_17

_baseOverlay_gj1jh_20

_betaBadge_mbh48_65

_btnDanger_1fl1d_98

_btnGhost_1fl1d_59

_btnOutline_1fl1d_48

_btnPrimary_1fl1d_80

_btnSolid_1fl1d_70

_btn_1fl1d_2

C

_cancelButton_10ud6_165

_cancelScheduleButton_1s17f_1202

_cancel_16pja_84

_cancel_1pa8q_211

_cardActions_1tlzn_324

_cardDescription_1mhuy_352_cardHeader_1tlzn_315

_cardMeta_1mhuy_375

_cardTitle_1mhuy_333

_card_1mhuy_2

_card_1tlzn_308

_characterInfoMarkdownContent_123vi_223

_characterInfoMarkdownContent_1yi4w_5

_characterInfoMarkdownContent_9gldz_223

_characterInfoShinyBox_1yi4w_265

_characterInfoShinyBoxInner_1yi4w_286

_checkboxCard_exkyv_105

_checkboxCardError_exkyv_112

_content_xxqvx_12

_count_138g0_7

_createButton_1jb5k_14 pp-top-bar-create-char profile-top-bar-create-char glow-on-hover

css-197qci7

css-1d22cyw

css-1jdnh42

css-1vh5zal

css-2lj9yr

css-7kiadw

css-z5908y

_content_67d1x_11

D

_detailName_4cue2_1923

_detailPane_4cue2_1839

E

_editScheduleButton_1s17f_1180

_expanded_2x3bf_208

_expandedInner_2x3bf_220

F

_filterButtonOpen_1vsdv_27

_footerHint_exkyv_148

_footer_w3wuk_1

H

_hintBox_2ljd6_74

_historyItem_10txd_1

_historyItemFocused_10txd_34

_holidays2025Pattern1_d0q9a_115

_holidays2025Pattern2_d0q9a_124

I

_iconError_1jwi8_310

_iconGlobe_2x3bf_84

_iconInfo_1jwi8_295

_iconSuccess_1jwi8_300

_iconWarning_1jwi8_305

_iconWarning_1s17f_102

_inner_2x3bf_31

_inputContainer_d8bkw_27

_inputError_exkyv_86

_input_10ud6_126

_input_1tlzn_260

_input_exkyv_52

_input_owmrz_7

_iosAlert_1s17f_263

_iosModalWarning_1s17f_544

_iosSelect_1s17f_805

_iosSettingItem_1s17f_46

_iosSettingsSection_1s17f_35

_iosStatusSection_1s17f_208

L

_loadMoreButton_1jwi8_474

_loadMore_1nqdj_38

M

_messageNavigation_1yi4w_348

_modal_pru5r_15

_modalContent_1jhaa_166

_modalWarning_1jwi8_779

_moderationBlock_1s17f_320

_moderationHeader_1s17f_360

_moderationNotes_di476_369

_moderationNotification_di476_333

_moderationReason_1s17f_405

_moderationSubject_di476_360

_motionHeader_1s17f_1361

_motionModal_1s17f_1339

_motionWarning_1s17f_1459

N

_navButton_1yi4w_359

_notificationsButton_1jwi8_7

_notificationItem_di476_2

O

_option_pru5r_82

_otherInput_pru5r_156

P

pp-top-bar-logo profile-top-bar-logo glow-logo css-1bmggo3

_primaryButton_2ljd6_91

_priorityHigh_1jwi8_372

_priorityLow_1jwi8_380

_priorityMedium_1jwi8_376

_privacyNote_2x3bf_301

profile-badge-flex-outer Btn2-purple pp-pg-total css-72h1ey

S

_scheduleInfoNote_1s17f_1106

_scheduleTypeOption_1s17f_1231

_scheduledInput_1s17f_887

_scheduledPreview_1s17f_972

_scheduledReleaseInfo_1s17f_1136

_scheduledReleaseSection_1s17f_863

_scheduledReleaseWarning_1s17f_876

_showLess_1bk4j_26

_signupTextarea_45b6m_172

_submitBtn_1gzug_172

T

_toolbar_1oo8z_6

Schnelltipp:
Du kannst mehrere Klassennamen in einem einzigen Absatz-Tag kombinieren, anstatt sie einzeln zu verwenden. So lassen sich Effekte verschiedener Klassen gleichzeitig überlagern.

Einfaches Beispiel:

div _characterInfoMarkdownContent_123vi_223 _trigger_6hekb_453 _autoResizeTextarea_mrqt8_1 image-input-dropzone

<p class="div _characterInfoMarkdownContent_123vi_223 _trigger_6hekb_453 _autoResizeTextarea_mrqt8_1 image-input-dropzone">dein Text</p>

Erstellt von Utkarsh auf Discord:

<p class="div iosStatusSection1s17f_208 iosStatusLine1s17f_223">Text <strong>Text</strong></p>

'Text'Text

<p class="div _iosStatusSection_1s17f_208 _iosStatusLine_1s17f_223">'Text' <a target="_blank" rel="noopener noreferrer" class="div Btn2-purple pp-pg-total" href="dein-link-hier"><strong>Link</strong></a></p>

'Text' Link

<p class="css-1jdnh42 _iosStatusLine_1s17f_223"><strong>Text hier</strong>dein Text hier</p>

Text hierdein Text hier

. <p class="_notificationItem_di476_2" style="text-align: center;"><a target="_blank" rel="noopener noreferrer nofollow" class="_unreadIndicator_di476_23" href="blank">.</a>dein Text hier</p>

Test! <p class="_characterInfoMarkdownContent_9gldz_223 _iosStatusLine_1s17f_223" style="text-align: center;"><a target="_blank" rel="noopener noreferrer nofollow" class="_characterAvatar_di476_67" href="blank">Test !</a>Dein Text hier</p>

<p class="_card_13n8k_2 _list_13n8k_67 _clickable_13n8k_28

_card_13n8k_2 _list_13n8k_67 _selected_13n8k_67 _clickable_13n8k_28

Trenne einfach jeden Klassennamen mit einem Leerzeichen. Beachte: Je mehr du kombinierst, desto schwieriger ist es herauszufinden, welche Klasse ein Problem verursacht, falls etwas kaputtgeht.

So verwendest du sie:
Für eine ausführlichere visuelle Anleitung zur Verwendung schau dir Rockets Anleitung

an. Öffne das Bio-Feld deines Charakters und klicke auf die Schaltfläche </> oben rechts im Editor. Dadurch wechselst du in die Rohansicht von HTML, in der du den zugrunde liegenden Code direkt sehen und bearbeiten kannst.

Um eine Klasse anzuwenden, umschließe deinen Inhalt mit einem Absatz-Tag wie diesem:
<p class="HIER_KLASSENNAME_EINFÜGEN">Dein Text hier</p>

Zum Beispiel:

<p class="div _characterInfoMarkdownContent_123vi_223">Dein Text hier</p>

Ersetze einfach HIER_KLASSENNAME_EINFÜGEN durch den gewünschten Namen.
Klicke nach dem Bearbeiten unten im HTML-Bereich auf Anwenden, um deine Änderungen zu speichern.