Akeru's Resources

Cute Sky Blue Bow Tie Pointer
Pixels
Animals

Animals 2



Alphabet Letters

words punctuation etc

More to be added

Dividers

extra dividers 1 2 3 4

Codes!
Text
Image
Tap Effects
Scrollbox
Hover
Others
Text Preview
Pop text

news ticker doesnt currently work in carrd idk why

text with hover Tooltip text

Mask

WOBBLY TEXT
Gradient
rubber band
Shake text
marquee text
bubble

B

O

U

N

C

Y

floating text

Refresh if it does not load properly
its a bit messy i apologize

Scrollbox Preview
double border

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
simple border

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

skew scrollbox 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 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
no border

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
lace border by @baeyhkun 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
Expand on hover info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info info
rounded edges

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

Bow border by @ciarispop 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

hello~ 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 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 text text text text text text text text text text

rounded edges

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
scrollbox with image in the background

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 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

pink lace border

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 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 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

this preview is not suited for mobile!

Image Preview

double border

brown lace border

shaking image

spinning

funky border

heartmask

glitching image

wobbly

pink lace

paper mask

floating

sliding element

lace border

popping img

png img glow

multiple borders

Absolute Positioning

<style>
#elementID {
position: absolute;
top: -0.5em;
left: -0.5em;
z-index: 50;
}
</style>

to rotate it add transform: rotate(20deg);

What is absolute positioning?

absolute positioning takes an element out of its original place in the page and placing it on a different positiong like the top bottom left or right values. It can be used for many things and it can take a while to place the things where you want them to be.

copy the code above and change the element ID to what element you want to change the position of. The element ID can be found in the settings.

You can change the top: -0.5em; left: -0.5em; to left: -0.5; or right: -0.5; adding the negative symbol will place it opposite to where it is when it does not have a - before the number. It takes a while to get it right so mess around with the values.

You can overlap the items by changing the z-index: 50; to a higher number or a lower number depending on what you want above or below a certain item. The higher the number is it will go on top and if it is lower then it will go below

an example of absolute positioning is above, the pixels are overlapping the image and container because I used absolute positioning :D
Image hovers

rotate hover

saturate

zoom + blur

zoom + blur + rotate

desaturate

zoom + rotate + saturate

sorry this looks really messy

These are things that float in the background of your carrd usually you would need to make these the first embed in your carrd for them to work.

btw glenthemes music players no longer works with dropboxpress the images to go to the links :D

Tutorials

1. Press the + button
2. Press add embed
3. Paste the code in the embed
4. You are done.

you should be able to add embeds as long as you have pro standard

oh no how do I change the text style?

Changing the style of the text are usually found between the <style> and </style> tags.

Press images to expand em

font: font-family: arial;
font size: font-size: 100px;
boldness: font-weight: bold; / font-weight: normal;
shadow: text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;
color: color: #000;

put them between the <style></style> tags btw like this:

<style>
#poop {
text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;
font-size: 50px;
font-weight: bold;
color: #ffffff;
font-family: arial;
}
</style>
<div id="poop"> TEXT </div>

1. Put an embed in your carrd
2. Paste the image style of your choice you can find em here
3. Change the img url or the tag to your image tag
4. You are done.

other codes need a img urlTo get a image url you need to upload your image into a site and get the url. I personally use gifyu
after you upload it you just have to change the <img src="link yeah">
to the link of your image

A tag is the #word or whatever that you can find in the begining of a code you want to replace that to your image tag which can be found in the settings

To put gifs beside or within text, your text has to be in an embed (not a regular text element) just put
<img src="image.gif">
anywhere you would like a gif or image, but replace the "image.gif" with the link to the image

The show must go on

To get a image link you can upload it in gifyu or you can left click on a pixel and press copy image adress

1. Press this link
2. Create a Cbox
3. You are done

To customize a cbox just press look and feel and customize it to your liking. once you click plubish it will give you the embed code

Press images to expand em

1. Paste the code linked here into an embed
2. Find a font you want and download it
3. Upload it in dropbox and copy the link
4. Paste the link into the 'link here' area
5. Change the 'www.' in the dropbox link to 'dl'
6. Add a font name in the 'name here'

To apply the font in your scrollbox or text just place the name of the font in font-family: name;


Another code for just a text with a specific font link

this is explained here

Basically just make the settings of the background to position: top the tile: horizontal and then the size make it default or custom depending on your liking.Changing the position to top right or top left will do fine too.

Press images to expand em

<style>
glub {
font-family: Arial;
font-size: 40px;
color: #ff00a9;
}
</style>

Use that code and add it to an embed
change the style to what you want it to be and then if you want to apply it put <glub></glub> before and after text that you want to apply it to. like <glub>this</glub>
if you want another one you can change glub to whatever word you want and do the same thing.

I like Switch very much

Switch is a unit of magicians that strives to be unique led by Natsume Sakasaki. An entertaining group that showcases the unifying power of their worldview through on-stage banter towards their fans.

In terms of their media work, Switch makes the most of their ability to chat by taking on jobs as radio personalities, guests on talk show programs, acting commentators, doing event performances, and by performing on kid-oriented variety shows. Work that utilizes their performance style is their main focus. Their theme color is yellow-green (#A3EA34).

Line break: <br></br> or <p></p>
Italics: <i></i> or <em></em>
Bold: <strong></strong> or <b></b>
Highlight: <mark></mark>
Underline: <u></u>
Line spacing: line-height: 1;
Letter spacing: letter-spacing: 1px;

For things that are not text add
margin: auto;
for text add
text-align: center/left/right;

1. Choose what kind of music player you would like to use
2. Download the song you want you can do this by copying the link and pasting it to ytmp3 and download it or upload it directly to dropbox after.
3. If you downloaded it upload it to dropbox and copy the link
4. Paste the link in the <audio id="audio" src="link here"audio"></audio> that you find in the code and change the 'www' to 'dl' or it will not work.

you can find music players here and in the music section

for music players that don't work with dropbox you can find ways to get links here

1. Make a new embed
2. Paste the code below

<style>
wee {
font-family: Arial;
font-size: 2em;
color: #000000;
}
</style>

3. You can change any of them to your liking!
You can also change the wee and make a bunch more for different text styles


The way you change a text is by adding <wee></wee> and put the text in between it like<wee>Hello!</wee>

These work in scrollboxes

Resources
Resource carrds/etc:
Coding:
Utility:
Fonts:
About the owner

Hi my name is Akeru and I am the owner of this resource carrd I made this to keep codes and etc

If you would like me to add or remove a code from this carrd please do dm me on instagram @harukawanyan also dm me there if you have any questions etc

The codes, pixels, and dividers in this carrd are not mine.