💡 Easily make outstanding interface with Discord Interface Creator!
Discord Interface Creator is heavily inspired by Canvas, and not affiliated with Canvas or Canvafy in any way.
To Install the discord-interface-creator
module, open a console and type the following code:
npm install discord-interface-creator
Using the module is pretty straightforward - expecting that you have decent knowledge in creating Discord bots.
Here's an example on using the profile card:
// INTERACTION IS THE INTERACTION VARIABLE YOU GET IN A COMMAND'S EXECUTE FUNCTION
const discordinterfacecreator = require("discord-interface-creator"); // The line to receive magic 🪄
const image = await new discordinterfacecreator.Profile()
.setAvatar(interaction.user.displayAvatarURL({ size: 256 })) // Image/web image link
.setBackground(
"image", // image/color - String
"https://website/images/image.png" // Web image link - String
)
.setUsername("Username") // String
.setDisplayname("Displayname") // String
.setField1("Level: 1") // String
.setField1Lower("Rank: 1") // String
.setField2("Thanks: :") // String
.setField2Lower("Rank: 1") // String
.setStatus("online") // online/offline/dnd/stream/idle - String
.setCustomStatus("#5865f2") // An alternative to .setStatus - Color - no idea when this would be useful.
.setBorder("#5865f2") // Hex color
.setBarColor("#5865f2") // Hex color
.setOverlayOpacity(0.5) // Number
.setCurrentXp(50) // Number
.setRequiredXp(100) // Number
.build(); // .build(); is required at the end.
interaction.reply({ files: [{ attachment: image, name: `profile.png` }] }) // Replies with the interface as an image attachment.
Here are all of the current interfaces for you to use for completely free:
Don't be shy! We would love to help you answer questions or fix issues that you encounter. Simply join our Discord and reach out to us from there.