Turn Your Status Into a Sticky Note

4 days ago — by Kayla⟡ — Text & Name Effects — used 13 times

Make the status under your profile picture look like a taped note.

CSS Code

Copy this and paste it at the bottom of the Advanced CSS tab in your layout editor, then save.

<style>
.general-about .details p:nth-of-type(2) {
  position: relative !important;
  display: block !important;
  width: fit-content !important;

  margin: 12px auto !important;
  padding: 8px 14px !important;

  background: #fff4b8 !important;
  border: 1px solid #d9c56f !important;
  border-radius: 5px !important;

  color: #5c5230 !important;
  text-align: center !important;

  box-shadow: 3px 3px 0 rgba(0,0,0,.12) !important;
  transform: rotate(-1deg) !important;
}

.general-about .details p:nth-of-type(2)::before {
  content: "" !important;

  position: absolute !important;
  top: -7px !important;
  left: 50% !important;

  width: 36px !important;
  height: 11px !important;

  background: rgba(210,225,255,.75) !important;
  border: 1px solid rgba(255,255,255,.85) !important;

  transform: translateX(-50%) rotate(2deg) !important;
}
</style>

How to use: copy the code above → open your layout editor → paste it at the bottom of the Advanced CSS tab → save → refresh your profile. Elements stack — you can combine as many as you like. New to CSS? Read the Custom Code Tutorial.

More in Text & Name Effects

« Back to Text & Name Effects | « All Profile Elements