> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.janitorai.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Code Collection: Profile Card

# Profile Card
###### No gradient for profile card
```
<style>
.css-1fjbtim {
opacity: 0;
}
</style>
```

###### No round corners for profile card
```
<style>
.css-52az4s {
border-radius: 0px;
}
</style>
```

###### Centered pfp, username, and follower count
Credits to Rosewing
```
<style>
.css-1uodvt1 {
padding-top: 0px;
flex-direction: column;
justify-items: center;
text-align: center;
}
</style>
```
Example:
![](https://storage.crisp.chat/users/helpdesk/website/-/8/b/4/e/8b4ea6e8d9765000/image_uh5q2y.png =375xauto)

###### Centered Badges
Original code by Rosewing, edited by ursium for the new update.
```
<style>
.css-hjkukh {
position: relative;
justify-content: center;
/* badge centering */
}
</style>
```

###### Follow button
Original code by ursium. New code by weirdykins.
To center it, you can adjust the container that it (+ the options button) are housed in:
```
<style>
.css-y9k5u7 {
justify-content: center; /* centers the follow and options button */
}
</style>
```
New code for follow button (includes text customization):
```
<style>
/* follow btn */
.Btn[data-following='true']:before { /* "followed" button */
position: absolute;
content: "TEXT" !important; /* input your text here */
color: #COLOUR; /* font colour */
border: NUMBERpx STYLE #COLOUR; /* border styling */
border-radius: NUMBERpx; /* how rounded the button is */
background-color: #COLOUR; /* background colour of the button */
font-family: FONT; /* set the font for the button */
}
.Btn[data-following='false']:before { /* "follow" button */
position: absolute;
content: "TEXT" !important; /* input your text here */
color: #COLOUR; /* font colour */
border: NUMBERpx STYLE #COLOUR; /* border styling */
border-radius: NUMBERpx; /* how rounded the button is */
background-color: #COLOUR; /* background colour of the button */
font-family: FONT; /* set the font for the button */
}
.Btn span { /* removes default "follow/followed" text */
visibility: hidden;
}
</style>
```
![](https://storage.crisp.chat/users/helpdesk/website/-/8/b/4/e/8b4ea6e8d9765000/image_1o9vdkp.png =323xauto)
---
| Previous Article | Next Article |
| ---- |
| [Return to Code Collection](https://janitorai.crisp.help/en/article/a-guide-to-css-code-collection-1ez72vq/) | [Code Collection: Bot Card ](https://janitorai.crisp.help/en/article/code-collection-bot-card-4cm4n9/) |