New Janitor AI Class Names || Description / Bio Boxes & Buttons

on JanitorAIarchived Oct 21, 2026

JanitorAI

Tokens: 3,267 permanent · 1 first greeting · estimated prompt budget 3,268

Creator notes

Recently, Janitor AI updated its class names and associated CSS styling, affecting bot bios and descriptions.

The updated class names and CSS selectors shared in this post were identified through inspection of Janitor AI’s front-end source code using browser DevTools. They are provided solely for cosmetic theming and creative customization by the community.

These class names are not officially documented or supported by Janitor AI and may change or break at any time without notice following a site update.

This information is shared for educational and creative purposes only.
No proprietary data, user data, or account credentials were accessed or extracted.

This is not affiliated with, endorsed by, or approved by JanitorAI and it's staff in any way.

i If you're having trouble integrating the codes into the character card, I recommend checking out Rocket's guide — it's a much more detailed visual guide that goes more in-depth than the one at the bottom of this bot.

If problems persist, try asking in the J.AI discord, as there's not much else I can do to help from my end.

Commonly used ones:

div _characterInfoMarkdownContent_123vi_223

_input_jv6cc_126

Currently looking for more.
This list is actively being updated as new class names are discovered. Check back for additions.

~101 class entries
2026-28-04
- Updated 4+ classes thanks to permanent
- Organized list from A-Z
2026-29-04
- Added <p class="class_name">p> To the personality section
- Opened Definition
2026-30-04
- Updated _card_13n8k_2
- Added _cardTitle_13n8k_402
2026-01-05
- Removed deprecated classes
( _viewAllStandalone_mi467_68, _segmentActive_kwwol_63, _segmented_kwwol_51, _content_1chl9_11, _characterMenu_128g5_496, _count_kwwol_25, _count_mi467_31)
16/05/2026
- Updated changed classes
^Thanks again, permanent(puppy)^
2026-19-10
- Removed deprecated classes
- Updated replacement classes

_appModalBadge_xxqvx_134

_appModalContent_xxqvx_85

_appModalCta_xxqvx_195

_archiveButton_di476_217

_autoResizeTextarea_mrqt8_1

_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

_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

_detailName_4cue2_1923

_detailPane_4cue2_1839

_editScheduleButton_1s17f_1180

_expanded_2x3bf_208

_expandedInner_2x3bf_220

_filterButtonOpen_1vsdv_27

_footerHint_exkyv_148

_footer_w3wuk_1

_hintBox_2ljd6_74

_historyItem_10txd_1

_historyItemFocused_10txd_34

_holidays2025Pattern1_d0q9a_115

_holidays2025Pattern2_d0q9a_124

_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

_loadMoreButton_1jwi8_474

_loadMore_1nqdj_38

_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

_navButton_1yi4w_359

_notificationsButton_1jwi8_7

_notificationItem_di476_2

_option_pru5r_82

_otherInput_pru5r_156

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

_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

_toolbar_1oo8z_6

Quick Tip:
You can stack multiple class names into a single paragraph tag instead of using separate ones. this lets you layer effects from different classes all at once.

Simple example:

div _characterInfoMarkdownContent_123vi_223 _trigger_6hekb_453 _autoResizeTextarea_mrqt8_1 image-input-dropzone

your text

Made by Utkarsh on discord:

Text Text

'Text'Text

'Text' link

Text Hereyour text here

.your text here

Test!

Test !Your Text here

_card_13n8k_2 _list_13n8k_67 _selected_13n8k_67 _clickable_13n8k_28

Just separate each class name with a space. Keep in mind the more you stack, the harder it is to figure out which one is causing issues if something breaks.

How To Use Them:
For a more in-depth visual guide on how to use them, check out Rocket's guide

Open your character bio field and click the button at the top right of the editor. This switches you to raw HTML view where you can see and edit the underlying code directly.

To apply a class, wrap your content in a paragraph tag like this:
<p class="YOUR_CLASS_NAME_HERE">Your Text Herep>

For example:

<p class="div _characterInfoMarkdownContent_123vi_223">Your Text Herep>

Just replace YOUR_CLASS_NAME_HERE With the one you want.
After editing, click Apply at the bottom of the HTML panel to save your changes.

deer_View on JanitorAI Origin page

Description

Recently, Janitor AI updated its class names and associated CSS styling, affecting bot bios and descriptions. The updated class names and CSS selectors shared in this post were identified through inspection of Janitor AI’s front-end source code using browser DevTools. They are provided solely for cosmetic theming and creative customization by the community.

These class names are not officially documented or supported by Janitor AI and may change or break at any time without notice following a site update.

This information is shared for educational and creative purposes only. No proprietary data, user data, or account credentials were accessed or extracted.

This is not affiliated with, endorsed by, or approved by JanitorAI and it's staff in any way. i If you're having trouble integrating the codes into the character card, I recommend checking out Rocket's guide — it's a much more detailed visual guide that goes more in-depth than the one at the bottom of this bot.

If problems persist, try asking in the J.AI discord, as there's not much else I can do to help from my end.

Commonly used ones: div _characterInfoMarkdownContent_123vi_223 _input_jv6cc_126

Currently looking for more. This list is actively being updated as new class names are discovered. Check back for additions. ~101 class entries

2026-28-04

Updated 4+ classes thanks to permanent
Organized list from A-Z

2026-29-04

Added
To the personality section
Opened Definition

2026-30-04

Updated _card_13n8k_2
Added _cardTitle_13n8k_402

2026-01-05

Removed deprecated classes ( _viewAllStandalone_mi467_68, _segmentActive_kwwol_63, _segmented_kwwol_51, _content_1chl9_11, _characterMenu_128g5_496, _count_kwwol_25, _count_mi467_31)

16/05/2026

Updated changed classes ^Thanks again, permanent(puppy)^

2026-19-10

Removed deprecated classes
Updated replacement classes

_appModalBadge_xxqvx_134 _appModalContent_xxqvx_85 _appModalCta_xxqvx_195 _archiveButton_di476_217 _autoResizeTextarea_mrqt8_1

_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

_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

_detailName_4cue2_1923 _detailPane_4cue2_1839

_editScheduleButton_1s17f_1180 _expanded_2x3bf_208 _expandedInner_2x3bf_220

_filterButtonOpen_1vsdv_27 _footerHint_exkyv_148 _footer_w3wuk_1

_hintBox_2ljd6_74 _historyItem_10txd_1 _historyItemFocused_10txd_34 _holidays2025Pattern1_d0q9a_115 _holidays2025Pattern2_d0q9a_124

_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

_loadMoreButton_1jwi8_474 _loadMore_1nqdj_38

_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

_navButton_1yi4w_359 _notificationsButton_1jwi8_7 _notificationItem_di476_2

_option_pru5r_82 _otherInput_pru5r_156

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

_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

_toolbar_1oo8z_6

Quick Tip: You can stack multiple class names into a single paragraph tag instead of using separate ones. this lets you layer effects from different classes all at once. Simple example: div _characterInfoMarkdownContent_123vi_223 _trigger_6hekb_453 _autoResizeTextarea_mrqt8_1 image-input-dropzone

your text

Made by Utkarsh on discord:

Text Text

'Text'Text

'Text' link

'Text' link

Text Hereyour text here

Text Hereyour text here

.your text here

Test!

Test !Your Text here

Just separate each class name with a space. Keep in mind the more you stack, the harder it is to figure out which one is causing issues if something breaks.

How To Use Them: For a more in-depth visual guide on how to use them, check out Rocket's guide Open your character bio field and click the </> button at the top right of the editor. This switches you to raw HTML view where you can see and edit the underlying code directly.

To apply a class, wrap your content in a paragraph tag like this:

Your Text Here

For example:

Your Text Here

Just replace YOUR_CLASS_NAME_HERE With the one you want. After editing, click Apply at the bottom of the HTML panel to save your changes.

Proxy allowed: Yes
Definition: Public

Chats: 485
Messages: 795
Tokens (upstream): 3,268

Last checked on JanitorAI: Oct 21, 2026Created Apr 10, 2026Updated Oct 19, 2026Archived since Oct 20, 2026

A

<p class="_appModalBadge_xxqvx_134">_appModalBadge_xxqvx_134</p>

<p class="_appModalContent_xxqvx_85">_appModalContent_xxqvx_85</p>

<p class="_appModalCta_xxqvx_195">_appModalCta_xxqvx_195</p>

<p class="_archiveButton_di476_217">_archiveButton_di476_217</p>

<p class="_autoResizeTextarea_mrqt8_1">_autoResizeTextarea_mrqt8_1</p>

B

<p class="_banner_2x3bf_17">_banner_2x3bf_17</p>

<p class="_baseOverlay_gj1jh_20">_baseOverlay_gj1jh_20</p>

<p class="_betaBadge_mbh48_65">_betaBadge_mbh48_65</p>

<p class="_btnDanger_1fl1d_98">_btnDanger_1fl1d_98</p>

<p class="_btnGhost_1fl1d_59">_btnGhost_1fl1d_59</p>

<p class="_btnOutline_1fl1d_48">_btnOutline_1fl1d_48</p>

<p class="_btnPrimary_1fl1d_80">_btnPrimary_1fl1d_80</p>

<p class="_btnSolid_1fl1d_70">_btnSolid_1fl1d_70</p>

<p class="_btn_1fl1d_2">_btn_1fl1d_2</p>

C

<p class="_cancelButton_10ud6_165">_cancelButton_10ud6_165</p>

<p class="_cancelScheduleButton_1s17f_1202">_cancelScheduleButton_1s17f_1202</p>

<p class="_cancel_16pja_84">_cancel_16pja_84</p>

<p class="_cancel_1pa8q_211">_cancel_1pa8q_211</p>

<p class="_cardActions_1tlzn_324">_cardActions_1tlzn_324</p>

<p class="_cardDescription_1mhuy_352">_cardDescription_1mhuy_352</p>

<p class="_cardHeader_1tlzn_315">_cardHeader_1tlzn_315</p>

<p class="_cardMeta_1mhuy_375">_cardMeta_1mhuy_375</p>

<p class="_cardTitle_1mhuy_333">_cardTitle_1mhuy_333</p>

<p class="_card_1mhuy_2">_card_1mhuy_2</p>

<p class="_card_1tlzn_308">_card_1tlzn_308</p>

<p class="_characterInfoMarkdownContent_123vi_223">_characterInfoMarkdownContent_123vi_223</p>

<p class="_characterInfoMarkdownContent_1yi4w_5">_characterInfoMarkdownContent_1yi4w_5</p>

<p class="_characterInfoMarkdownContent_9gldz_223">_characterInfoMarkdownContent_9gldz_223</p>

<p class="_characterInfoShinyBox_1yi4w_265">_characterInfoShinyBox_1yi4w_265</p>

<p class="_characterInfoShinyBoxInner_1yi4w_286">_characterInfoShinyBoxInner_1yi4w_286</p>

<p class="_checkboxCard_exkyv_105">_checkboxCard_exkyv_105</p>

<p class="_checkboxCardError_exkyv_112">_checkboxCardError_exkyv_112</p>

<p class="_content_xxqvx_12">_content_xxqvx_12</p>

<p class="_createButton_1jb5k_14 pp-top-bar-create-char profile-top-bar-create-char glow-on-hover">_createButton_1jb5k_14 pp-top-bar-create-char profile-top-bar-create-char glow-on-hover</p>

<p class="css-197qci7">css-197qci7</p>

<p class="css-1jdnh42">css-1jdnh42</p>

<p class="css-2lj9yr">css-2lj9yr</p>

<p class="css-z5908y">css-z5908y</p>

<p class="_content_67d1x_11">_content_67d1x_11</p>

D

<p class="_detailName_4cue2_1923">_detailName_4cue2_1923</p>

<p class="_detailPane_4cue2_1839">_detailPane_4cue2_1839</p>

E

<p class="_editScheduleButton_1s17f_1180">_editScheduleButton_1s17f_1180</p>

<p class="_expanded_2x3bf_208">_expanded_2x3bf_208</p>

<p class="_expandedInner_2x3bf_220">_expandedInner_2x3bf_220</p>

F

<p class="_filterButtonOpen_1vsdv_27">_filterButtonOpen_1vsdv_27</p>

<p class="_footerHint_exkyv_148">_footerHint_exkyv_148</p>

<p class="_footer_w3wuk_1">_footer_w3wuk_1</p>

H

<p class="_hintBox_2ljd6_74">_hintBox_2ljd6_74</p>

<p class="_historyItem_10txd_1">_historyItem_10txd_1</p>

<p class="_historyItemFocused_10txd_34">_historyItemFocused_10txd_34</p>

<p class="_holidays2025Pattern1_d0q9a_115">_holidays2025Pattern1_d0q9a_115</p>

<p class="_holidays2025Pattern2_d0q9a_124">_holidays2025Pattern2_d0q9a_124</p>

I

<p class="_iconError_1jwi8_310">_iconError_1jwi8_310</p>

<p class="_iconGlobe_2x3bf_84">_iconGlobe_2x3bf_84</p>

<p class="_iconInfo_1jwi8_295">_iconInfo_1jwi8_295</p>

<p class="_iconSuccess_1jwi8_300">_iconSuccess_1jwi8_300</p>

<p class="_iconWarning_1jwi8_305">_iconWarning_1jwi8_305</p>

<p class="_iconWarning_1s17f_102">_iconWarning_1s17f_102</p>

<p class="_inner_2x3bf_31">_inner_2x3bf_31</p>

<p class="_inputContainer_d8bkw_27">_inputContainer_d8bkw_27</p>

<p class="_inputError_exkyv_86">_inputError_exkyv_86</p>

<p class="_input_10ud6_126">_input_10ud6_126</p>

<p class="_input_1tlzn_260">_input_1tlzn_260</p>

<p class="_input_exkyv_52">_input_exkyv_52</p>

<p class="_input_owmrz_7">_input_owmrz_7</p>

<p class="_iosAlert_1s17f_263">_iosAlert_1s17f_263</p>

<p class="_iosModalWarning_1s17f_544">_iosModalWarning_1s17f_544</p>

<p class="_iosSelect_1s17f_805">_iosSelect_1s17f_805</p>

<p class="_iosSettingItem_1s17f_46">_iosSettingItem_1s17f_46</p>

<p class="_iosSettingsSection_1s17f_35">_iosSettingsSection_1s17f_35</p>

<p class="_iosStatusSection_1s17f_208">_iosStatusSection_1s17f_208</p>

L

<p class="_loadMoreButton_1jwi8_474">_loadMoreButton_1jwi8_474</p>

<p class="_loadMore_1nqdj_38">_loadMore_1nqdj_38</p>

M

<p class="_messageNavigation_1yi4w_348">_messageNavigation_1yi4w_348</p>

<p class="_modal_pru5r_15">_modal_pru5r_15</p>

<p class="_modalWarning_1jwi8_779">_modalWarning_1jwi8_779</p>

<p class="_moderationBlock_1s17f_320">_moderationBlock_1s17f_320</p>

<p class="_moderationHeader_1s17f_360">_moderationHeader_1s17f_360</p>

<p class="_moderationNotes_di476_369">_moderationNotes_di476_369</p>

<p class="_moderationNotification_di476_333">_moderationNotification_di476_333</p>

<p class="_moderationReason_1s17f_405">_moderationReason_1s17f_405</p>

<p class="_moderationSubject_di476_360">_moderationSubject_di476_360</p>

<p class="_motionHeader_1s17f_1361">_motionHeader_1s17f_1361</p>

<p class="_motionModal_1s17f_1339">_motionModal_1s17f_1339</p>

<p class="_motionWarning_1s17f_1459">_motionWarning_1s17f_1459</p>

N

<p class="_navButton_1yi4w_359">_navButton_1yi4w_359</p>

<p class="_notificationsButton_1jwi8_7">_notificationsButton_1jwi8_7</p>

<p class="_notificationItem_di476_2">_notificationItem_di476_2</p>

O

<p class="_option_pru5r_82">_option_pru5r_82</p>

<p class="_otherInput_pru5r_156">_otherInput_pru5r_156</p>

P

<p class="pp-top-bar-logo profile-top-bar-logo glow-logo css-1bmggo3">pp-top-bar-logo profile-top-bar-logo glow-logo css-1bmggo3</p>

<p class="_primaryButton_2ljd6_91">_primaryButton_2ljd6_91</p>

<p class="_priorityHigh_1jwi8_372">_priorityHigh_1jwi8_372</p>

<p class="_priorityLow_1jwi8_380">_priorityLow_1jwi8_380</p>

<p class="_priorityMedium_1jwi8_376">_priorityMedium_1jwi8_376</p>

<p class="_privacyNote_2x3bf_301">_privacyNote_2x3bf_301</p>

<p class="profile-badge-flex-outer Btn2-purple pp-pg-total css-72h1ey">profile-badge-flex-outer Btn2-purple pp-pg-total css-72h1ey</p>

S

<p class="_scheduleInfoNote_1s17f_1106">_scheduleInfoNote_1s17f_1106</p>

<p class="_scheduleTypeOption_1s17f_1231">_scheduleTypeOption_1s17f_1231</p>

<p class="_scheduledInput_1s17f_887">_scheduledInput_1s17f_887</p>

<p class="_scheduledPreview_1s17f_972">_scheduledPreview_1s17f_972</p>

<p class="_scheduledReleaseInfo_1s17f_1136">_scheduledReleaseInfo_1s17f_1136</p>

<p class="_scheduledReleaseSection_1s17f_863">_scheduledReleaseSection_1s17f_863</p>

<p class="_scheduledReleaseWarning_1s17f_876">_scheduledReleaseWarning_1s17f_876</p>

<p class="_showLess_1bk4j_26">_showLess_1bk4j_26</p>

<p class="_signupTextarea_45b6m_172">_signupTextarea_45b6m_172</p>

<p class="_submitBtn_1gzug_172">_submitBtn_1gzug_172</p>

T

<p class="_toolbar_1oo8z_6">_toolbar_1oo8z_6</p>

Permanent link to this version