Custom Profile CSS

Getting started

1. Open your profile and tap Edit Profile.
2. Scroll to Custom CSS and tap to open the editor.
3. Paste or write your CSS, then save.

Custom CSS is a premium feature. Free accounts can preview the editor but need to upgrade to publish styles.

How it works

Every selector you write is automatically scoped to your profile page — so your styles can't leak into the rest of the app. The root container is .profile-page-root, and bare html or body selectors are rewritten to target it.

Stylesheets are capped at 10,000 characters.

What's supported

• • Standard CSS properties, pseudo-classes, and pseudo-elements
• • @media, @supports, and @container queries
• • @keyframes animations and @font-face declarations
• • Images via url() — limited to https://, relative paths, and data:image/ URIs

What's blocked

For everyone's safety, the sanitizer strips a few things automatically:

• • @import, expression(), and behavior:
• • javascript:, vbscript:, and data:text/html URLs
• • position: fixed is rewritten to absolute so styles can't overlay the rest of the app
• • Inline scripts and any unrecognized at-rules

Examples

A simple recolor

/* Tint the background and round out cards */
.profile-page-root {
  background: linear-gradient(180deg, #1a0b2e 0%, #0f0820 100%);
  color: #f5e9ff;
}

.profile-card {
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

Custom font with an animated header

/* Custom font + animated header */
@font-face {
  font-family: "MyFont";
  src: url("https://example.com/font.woff2") format("woff2");
}

.profile-page-root {
  font-family: "MyFont", system-ui, sans-serif;
}

@keyframes shimmer {
  0%   { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

.profile-header {
  background: linear-gradient(90deg, #ff6b9d, #c66bff, #6b9dff);
  background-size: 200% 200%;
  animation: shimmer 6s ease-in-out infinite;
}

Ready-made templates

Not sure where to start? Grab one of these 25 drop-in aesthetics. Hit Copy CSS, paste it into your profile's Custom CSS field, and save.