← Back to Layouts
Orange n Cute

Name: FriendRewind
Author: FriendRewind
Author: LuckyMango
Category: Colorful
Created: August 28, 2026
orange, swirl background, pastel, orange, cute,blog
Comments (0)

No comments yet. Be the first!
You must log in to comment.
CSS Code

<style id="fr-vb2">
/* VB2_STATE:{"cursorUrl":"","overlayUrl":"","overlayOpacity":0.2,"avatarAnimation":"","pageFont":"","useLiveProfile":true,"previewUrl":"/profile?id=4","pageBgImage":"","pageBgMode":"cover","heroImageUrl":"","profileRowBgImage":"","profileRowBgMode":"cover","navBgColor":"#2b333f","navBgImage":"","navBgMode":"cover","navLinkColor":"#ffffff","navLinkHover":"#66aaff","boxBgColor":"#ffffff","boxOpacity":1,"boxRadius":8,"contactHeaderBg":"#4169E1","contactHeaderText":"#ffffff","contactContentBg":"#ffffff","contactBorderColor":"#4169E1","contactBorderWidth":1,"contactBorderRadius":5,"contactBoxAnimation":"","interestsHeaderBg":"#DAA520","interestsHeaderText":"#ffffff","interestsContentBg":"#ffffff","interestsBorderColor":"#DAA520","interestsBorderWidth":1,"interestsBorderRadius":5,"contentBoxAnimation":"","textBody":"#000000","textHeading":"#000000","textLink":"#0066cc","headingShadowColor":"#000000","headingShadowBlur":2,"headingShadowEnable":false,"moduleImages":{"contact":"","urlInfo":"","tableSection":"","tunes":"","blogPreview":"","blurbs":"","friends":"","Comments Background":"","comments":""}} */
/* Generated by FriendRewind.com Visual Builder */
</style><style>


/* FR_MANUAL_EXTRAS */
```html
</style>
<style>

/* 🍊🍊🍊 LUCKYMANGO — PASTEL ORANGE THEME 🍊🍊🍊 */


/* =========================
   🍊 FONTS
========================= */

@import url('https://fonts.googleapis.com/css2?family=Chewy&family=Sarina&display=swap');


/* =========================
   🍊 MAIN BACKGROUND
========================= */

body {
  font-family: 'Chewy', Arial, sans-serif !important;
  font-size: 18px !important;

  background-color: #fff4e6 !important;

  /* 🍊 YOUR ORIGINAL SPACEHEY BACKGROUND */
  background-image: url('https://i.pinimg.com/originals/a3/de/94/a3de9499a8996375806a0f89eb479a29.png') !important;

  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;

  overflow-x: hidden !important;

  min-height: 100vh !important;

  padding-top: 10% !important;
  padding-bottom: 10% !important;
  padding-left: 12% !important;
  padding-right: 12% !important;

  box-sizing: border-box !important;
}


/* =========================
   🚫 REMOVE ALL RANDOM OVERLAYS
========================= */

/* Removes lace, fog, static, CRT effects,
   and the random floating cat */

html::after,
body::before,
body::after,
.static-layer,
.fixed-profile-frame-img {
  display: none !important;
  content: none !important;
  background-image: none !important;
}


/* =========================
   ✨ SOFT FLOATING EFFECT
========================= */

.col,
main,
footer,
nav::before,
.online,
nav .links,
nav .top {
  animation: float 4s ease-in-out infinite !important;
}

@keyframes float {

  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-5px);
  }

  100% {
    transform: translateY(0px);
  }

}


/* =========================
   🍊 MAIN CONTAINER
========================= */

.container,
main,
#main {

  max-width: 100% !important;
  width: 100% !important;

  margin-left: auto !important;
  margin-right: auto !important;

  background: transparent !important;

  box-sizing: border-box !important;
}

main {

  border: none !important;

  box-shadow: none !important;

  padding: 0 !important;
}


/* =========================
   🍊 TOP BAR
========================= */

.top {

  display: flex !important;

  background: #ffe1bf !important;

  border: 3px dotted #efa45c !important;

  border-radius: 16px !important;

  padding: 10px 20px !important;

  margin: 10px !important;

  align-items: center !important;

  justify-content: space-between !important;

  gap: 15px !important;

  box-shadow:
    0 0 12px rgba(232,154,91,0.30) !important;
}


.top .left,
.top .center,
.top .right {

  display: flex !important;

  align-items: center !important;

  font-family: 'Chewy', Arial, sans-serif !important;

  color: #704b3a !important;
}


/* =========================
   🔎 SEARCH
========================= */

.search-wrapper {

  display: flex !important;

  background: #fffaf5 !important;

  border: 2px dotted #efa45c !important;

  border-radius: 12px !important;

  padding: 4px 10px !important;
}


.search-wrapper input {

  background: transparent !important;

  border: none !important;

  outline: none !important;

  color: #704b3a !important;

  font-family: 'Chewy', Arial, sans-serif !important;

  font-size: 14px !important;
}


.search-wrapper button,
.logout-btn {

  background: #ffc98f !important;

  border: 2px dotted #e7a05b !important;

  border-radius: 10px !important;

  color: #704b3a !important;

  padding: 5px 12px !important;

  font-family: 'Chewy', Arial, sans-serif !important;

  cursor: pointer !important;

  transition: 0.2s ease !important;
}


.search-wrapper button:hover,
.logout-btn:hover {

  background: #e99a55 !important;

  color: white !important;
}


/* =========================
   🍊 NAVIGATION
========================= */

nav {

  margin: 10px !important;
}


nav .links {

  border: 3px dotted #efa45c !important;

  border-radius: 16px !important;

  background: #ffe1bf !important;

  padding: 7px !important;

  box-shadow:
    0 0 12px rgba(232,154,91,0.30) !important;

  display: flex !important;

  justify-content: center !important;

  gap: 10px !important;

  overflow: hidden !important;
}


nav .links a,
nav .links a:link,
nav .links a:visited,
nav .links a:active {

  font-family: 'Chewy', Arial, sans-serif !important;

  font-size: 14px !important;

  color: #704b3a !important;

  padding: 7px 12px !important;

  text-decoration: none !important;

  display: inline-block !important;
}


nav .links a:hover {

  color: #e58b45 !important;

  text-shadow:
    1px 1px 0 #fff0dc !important;
}


/* =========================
   🧡 TEXT
========================= */

p,
span,
td,
.inner,
.profile-info,
footer p {

  font-family: 'Chewy', Arial, sans-serif !important;

  color: #704b3a !important;
}


h1,
h2,
h3,
h4,
h5,
h6,
.heading {

  font-family: 'Chewy', Arial, sans-serif !important;

  color: #704b3a !important;
}


b,
strong {

  color: #704b3a !important;
}


a,
a:link,
a:visited,
a:active {

  color: #704b3a !important;

  text-decoration: none !important;
}


a:hover {

  color: #e58b45 !important;
}


/* =========================
   🍊 PROFILE NAME
========================= */

div.profile .w-40 h1,
div.profile .col.w-40.left h1,
.w-40 h1,
.col.w-40.left h1 {

  font-family: 'Sarina', cursive !important;

  font-size: 65px !important;

  text-align: center !important;

  background:
    linear-gradient(
      #ed9b55,
      #ffd5a6
    ) !important;

  -webkit-background-clip: text !important;

  -webkit-text-fill-color: transparent !important;

  -webkit-text-stroke:
    1.5px #704b3a !important;

  border-bottom:
    3px solid #efa45c !important;

  padding-bottom: 5px !important;

  margin-bottom: 15px !important;

  filter:
    drop-shadow(
      0 3px 4px #ffe2c2
    ) !important;
}


/* =========================
   🍊 GENERAL SECTIONS
========================= */

.profile,
.table-section,
.module,
.blurbs,
.section,
.profileInfo,
.friend-space,
.badges-section,
.url-info,
.contact,
.interests,
.comments-table,
.friends,
.home-actions,
footer,
.footer,
#footer {

  background: #fff0df !important;

  /* 🚫 NO IMAGE BACKGROUNDS */
  background-image: none !important;

  border:
    3px dotted #efa45c !important;

  border-radius: 16px !important;

  padding: 15px !important;

  margin-top: 15px !important;

  margin-bottom: 15px !important;

  box-shadow:
    0 0 12px
    rgba(232,154,91,0.28) !important;

  box-sizing: border-box !important;
}


/* =========================
   🍊 SECTION HEADERS
========================= */

.profile h1,
.blurbs .heading,
.section .heading,
.module .heading,
.profileInfo .heading,
.table-section h4,
.module h4,
.blurbs h4,
.section h4,
.contact .heading,
.table-section .heading,
.home-actions .heading,
.friends .heading {

  background: #ffc98f !important;

  border-bottom:
    2px dotted #e58b45 !important;

  padding: 7px 12px !important;

  margin:
    -15px -15px 15px -15px !important;

  border-radius:
    12px 12px 0 0 !important;

  font-family:
    'Chewy', Arial, sans-serif !important;

  font-size: 15px !important;

  color: #704b3a !important;
}


/* =========================
   🍊 FRIENDS
========================= */

.friend-space,
.friends {

  background: #fff0df !important;

  background-image: none !important;

  border:
    3px dotted #efa45c !important;

  border-radius: 16px !important;

  box-shadow:
    0 0 12px
    rgba(232,154,91,0.28) !important;
}


/* =========================
   💬 COMMENTS
========================= */

.comments-table {

  background: #fff0df !important;

  background-image: none !important;

  border:
    3px dotted #efa45c !important;

  border-radius: 16px !important;
}


.comments-table td {

  background: #fff0df !important;

  border-color:
    #f2bd82 !important;
}


/* =========================
   🍊 INTERESTS
========================= */

.interests table,
.interests .inner {

  border-collapse: collapse !important;

  width: 100% !important;
}


.interests td {

  border-bottom:
    2px dotted #efa45c !important;

  padding: 8px 4px !important;
}


.interests tr:last-child td,
.interests td:last-child {

  border-bottom: none !important;
}


.interests p {

  border-bottom:
    2px dotted #efa45c !important;

  padding-bottom: 8px !important;

  margin-bottom: 8px !important;
}


.interests p:last-of-type {

  border-bottom: none !important;
}


/* =========================
   🖼️ PROFILE PICTURE
========================= */

.general-about .profile-pic img,
.profile-pic img,
#profile-pic-container img,
profile .profile-pic img {

  -webkit-mask-image:
    url('https://files.catbox.moe/rra6vz.png') !important;

  -webkit-mask-size:
    contain !important;

  -webkit-mask-repeat:
    no-repeat !important;

  -webkit-mask-position:
    center !important;

  border-radius: 0 !important;

  object-fit: cover !important;
}


/* =========================
   🎵 PLAYLIST
========================= */

div#profile-playlist-container {

  width: 100% !important;

  max-width: 100% !important;

  display: block !important;
}


.profile-playlist-widget {

  background: #fff0df !important;

  background-image: none !important;

  border:
    3px dotted #efa45c !important;

  border-radius: 16px !important;

  padding: 12px !important;

  color: #704b3a !important;

  box-shadow:
    0 0 12px
    rgba(232,154,91,0.25) !important;

  font-family:
    'Chewy', Arial, sans-serif !important;
}


.profile-playlist-widget h3 {

  color: #704b3a !important;

  font-family:
    'Chewy', Arial, sans-serif !important;
}


.profile-playlist-widget .song-info {

  color: #704b3a !important;

  font-family:
    'Chewy', Arial, sans-serif !important;

  font-weight: bold !important;
}


.profile-playlist-widget .song-artist {

  color: #e58b45 !important;

  font-family:
    'Chewy', Arial, sans-serif !important;
}


.profile-playlist-widget button {

  background: #ffc98f !important;

  color: #704b3a !important;

  border: none !important;

  border-radius: 10px !important;

  font-family:
    'Chewy', Arial, sans-serif !important;

  padding: 3px 8px !important;
}


.profile-playlist-widget button:hover {

  background: #e99a55 !important;

  color: white !important;
}


.profile-playlist-widget li.current {

  background: #e99a55 !important;

  color: white !important;

  border-radius: 10px !important;

  padding: 4px 8px !important;
}


.profile-playlist-widget li.current .song-info,
.profile-playlist-widget li.current .song-artist {

  color: white !important;
}


.profile-playlist-widget li.profile-playlist-item:hover {

  background: #ffd6aa !important;

  color: #704b3a !important;

  border-radius: 10px !important;
}


.pp-equalizer {

  display: none !important;
}


/* =========================
   📝🍊 BLOG — THE MAIN CHARACTER
========================= */

.blog-preview {

  background: #ffe0bd !important;

  background-image: none !important;

  border:
    4px solid #e99a55 !important;

  border-radius: 20px !important;

  padding: 18px !important;

  margin-top: 30px !important;

  margin-bottom: 30px !important;

  box-shadow:

    0 0 0 4px #fff0df,

    0 0 20px
    rgba(232,154,91,0.50) !important;

  position: relative !important;

  transform: scale(1.025) !important;

  z-index: 5 !important;
}


/* BIG BLOG HEADER */

.blog-preview h4 {

  background: #f2a45f !important;

  color: #fffaf5 !important;

  font-size: 23px !important;

  text-align: center !important;

  letter-spacing: 2px !important;

  border: none !important;

  border-radius: 14px !important;

  padding: 11px !important;

  margin:
    -18px -18px 18px -18px !important;

  text-shadow:
    1px 1px 0 #b96d35 !important;

  box-shadow:
    0 4px 0 #d98543 !important;
}


/* BLOG TITLES */

.blog-preview a {

  color: #c86f32 !important;

  font-size: 18px !important;

  font-weight: bold !important;

  text-decoration: none !important;
}


.blog-preview a:hover {

  color: #e58b45 !important;

  text-decoration: underline !important;
}


/* BLOG TEXT */

.blog-preview p {

  color: #704b3a !important;

  font-size: 15px !important;

  line-height: 1.5 !important;
}


/* =========================
   📝 BLOG POSTS
========================= */

.blog-entry,
.blog,
.blog-post {

  background: #fff0df !important;

  background-image: none !important;

  border:
    3px dotted #efa45c !important;

  border-radius: 18px !important;

  padding: 16px !important;

  margin-bottom: 18px !important;

  box-shadow:
    0 0 12px
    rgba(232,154,91,0.25) !important;
}

  
/* =========================
   🖱️ CUSTOM CURSOR
========================= */

* {

  cursor:
    url('https://external-media.spacehey.net/media/swFB45eLHtxoo5WISoNMw6lviM4kE2Daq7mMcNPJBVOk=/https://64.media.tumblr.com/tumblr_m2wj5jgL671qfamg6.gif'),
    auto !important;
}


/* =========================
   📇 CONTACT ICONS
========================= */

.contact a,
.contact td a,
.contact .inner a {

  display: inline-flex !important;

  align-items: center !important;

  gap: 8px !important;
}


.contact img,
.contact td img,
.contact .inner img {

  content: url(
    'https://64.media.tumblr.com/204cfeb8f36b1dd06763d6810e01946b/0ff21daacf0346e3-32/s75x75_c1/c15d4967e1400e05a3feaf2363c9cb9f02ddb084.gifv'
  ) !important;

  width: 20px !important;

  height: 20px !important;

  object-fit: contain !important;
}


/* =========================
   🍊 SCROLLBAR
========================= */

::-webkit-scrollbar {

  width: 12px !important;

  height: 12px !important;
}


::-webkit-scrollbar-track {

  background: #fff4e6 !important;

  border-left:
    1px solid #ffd6aa !important;
}


::-webkit-scrollbar-thumb {

  background: #f2b36f !important;

  border-radius: 10px !important;

  border:
    3px solid #fff4e6 !important;
}


::-webkit-scrollbar-thumb:hover {

  background: #e58b45 !important;
}
<!-- (c) Layout created by Vampir3 (https://layouts.spacehey.com/layout?id=93454) --> <style> body:before { content: " "; height: 100vh; width: 100vw; display: block; position: fixed; top: 0; left: 0; z-index: 100; background-image: url('https://static.wikia.nocookie.net/theglitterforce/images/1/15/Glitter_peace_intro_catchphres.gif/revision/latest?cb=20210113000135'); background-size: cover; background-repeat: no-repeat; background-position:center; animation: yourAnimation 5s ease 0s 1 normal forwards; pointer-events: none;} @keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } </style><style>


* {

  scrollbar-width: thin !important;

  scrollbar-color:
    #f2b36f
    #fff4e6 !important;
}

</style>
</style>