Page Settings:

width - 27

padding vertical and horizontal - 3

size - 18

alignment - center

spacing - 0.75

Container Settings:

Columns - Left 40%    Right 60%

width - 75

padding vertical and horizontal - 0.25

gutters - 0.25

margins - top: 0, bottom: 0.25

alignment - auto

Contents alignment - auto, top

spacing - 0.75

Go into Mobile > Manual and switch the Layout from stack to default

Image Settings:

width - 15

height - auto

margins  - 0.125

Scroll Box Embed: This embed adds the scroll box with the lace border. Cr @baeyhkun!

<style>

@font-face {

font-family: fairy;

src: url(https://dl.dropbox.com/s/mxtcrksdyzjg2cf/Cookies%203.ttf?dl=0);

}

#fairy {

font-family: fairy;

}

@font-face {

font-family: daydream;

src: url(https://dl.dropbox.com/s/ric20v09lep0g4d/Daydream.ttf?dl=0);

}

#daydream {

font-family: daydream;

}

@font-face {

font-family: soup;

src: url(https://dl.dropbox.com/s/t6umd2c7bykv984/Candy%20Beans.otf?dl=0);

}

#soup {

font-family: soup;

}

#scroll1 {

border-width:7px;

border-style:solid;

border-image: url("https://media.discordapp.net/attachments/826854899013648384/839700444375810078/tumblr_inline_o98n9dbCl61u2r0ws_540_1_2.png") 8 fill round;

height: 130px;

width: 100%;

padding: 6px;

font-size: 12px;

overflow: auto;

text-align:left;

font-family: soup;

line-height: 15.5px;

color: #6E6B67;

}

tag {

background: #d5c5b6;

border-radius:7px;

border: 1px solid black;

padding-left: 5px;

padding-right: 5px;

color: #fff;

text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;

letter-spacing: normal;

font-family: fairy;

font-size:12px;

}

num {

color: #fff;

text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;

font-family: soup;

font-size: 12px;

overflow: auto;

text-align:left;

font-family: soup;

line-height: 15.5px;

}

</style>

<div id="scroll1">

<tag>about</tag> <! -- don’t forget to add a space after each tag to keep the text separated! -->

Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

<br></br>

<tag>interests</tag>

Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

<br></br>

<tag>byf</tag>

<num> 1)</num> Text text text.

<num> 2)</num> Text text text.

<num> 3)</num> Text text text.

<num> 4)</num> Text text text.

<num> 5)</num> Text text text.

<num> 6)</num> Text text text.

<num> 7)</num> Text text text.

<num> 8)</num> Text text text.

<num> 9)</num> Text text text.

<br></br>

<tag>dfi</tag>

<num> 1)</num> Text text text.

<num> 2)</num> Text text text.

<num> 3)</num> Text text text.

<num> 4)</num> Text text text.

<num> 5)</num> Text text text.

<num> 6)</num> Text text text.

<num> 7)</num> Text text text.

<num> 8)</num> Text text text.

<num> 9)</num> Text text text.

<num> ✦</num> Text text text.

<br></br>

<tag>stan list</tag>

Groups biases whatever text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text.

<br></br>

<tag>links</tag>

<a href="URL" target="_blank"> title</a>

<a href="https://twitter.com/user?s=21" target="_blank"> twitter</a>

<a href="URL" target="_blank"> title</a>

<a href="URL" target="_blank"> title</a>

<a href="URL" target="_blank"> title</a>

<br></br>

<! -- Don't remove credits pls! -->

lace border by @baeyhkun.

<p>crd by <a href="https://twitter.com/coracrd?s=21" target="_blank">@coracrd</a></p>

</div>

Container Settings: (Same as the other one)

Columns - Left 50%    Right 50%

width - 75

padding vertical and horizontal - 0.25

gutters - 0.25

margins - top: 0, bottom: 0.25

alignment - auto

Contents alignment - auto, top

spacing - 0.75

Go into Mobile > Manual and switch the Layout from stack to default

The text will be your name. It should be looking like this right now!

Name and Kitty pixel Embed: This embed adds the font to your name and the cat pixel gif

<style>

#text01 {

font-family: daydream;

font-size: 11px;

position: absolute;

top: 15px;

right: 15px; /* play with this setting to arrange your name*/

}

#kitty {

position: relative;

top: 8px;

left: 95px; /* play with this setting to arrange the pixel*/

}

</style>

<div id="kitty">

<img src="https://i.imgur.com/e2LsTiT.gif">

</div>

Heart Blur Image Mask Embed: This embed puts the heart blur mask on your images!

<style>

#image01 {

width: 200px;

height: auto;

-webkit-mask-image: url(https://i.imgur.com/UTGIdbJ.png);

-webkit-mask-size: 100%; /* change if it cuts off weirdly */

-webkit-mask-repeat: no-repeat;

-webkit-mask-position: center;

</style>

Music Player Embed: This embed puts the music player in your carrd.

(By GLENTHEMES!)

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

<!-------MUSIC PLAYER BY GLENTHEMES------->

<script src="//static.tumblr.com/gtjt4bo/QRmphdsdv/glenplayer02.js"></script>

<style type="text/css">

/*-------MUSIC PLAYER BY GLENTHEMES-------*/

#glenplayer02 {

position: absolute;

bottom: 190px;

right: 21px;

display:flex;

z-index:99;

}

#glenplayer02 a {text-decoration:none;}

#glenplayer02 > div {

align-self:center;

-webkit-align-self:center;

}

.music-controls {

user-select:none;

-webkit-user-select:none;

width:21px;

font-size:20px;

cursor:pointer;

}

.playy, .pausee {color:#000;} /* color of play & pause buttons */

.pausee {display:none;}

.sonata {

margin-left:10px;

color:#222; /* color of music note symbol */

}

.labeltext {

margin-left:8px;

font-family:courier new;

font-size:9px;

color:#222; /* color of song title */

}

</style>

<body>

<!-------MUSIC PLAYER BY GLENTHEMES------->

<div id="glenplayer02">

<div class="music-controls" onclick="songstart();">

<div class="playy">►</div> <! -- Play Symbol -->

<div class="pausee">❚❚</div> <! -- Pause Symbol -->

</div>

<div class="sonata"> </div>

<div class="labeltext"> </div> <! -- leave blank unless u want the song title to show -->

</div><!--end music player-->

<audio id="tune" src="https://dl.dropbox.com/s/cip7olg67qjwj2k/xoxo.mp3?dl=0"audio"></audio> <! -- song url! -->

</body>

<div class="labeltext"> </div>

Now it should look like this!

You're finished! If you want a popup message, keep scrolling :3

Message Embed: This embed puts a pop-up message when you enter the carrd!

<!-- this script got from www.javascriptfreecode.com - Coded by: Krishna Eydat -->

<html>

<head>

<script language="javascript" type="text/javascript">

alert("scroll~ and click the play button (►) for music!") /* Message */

</script>

</head>

</html>