Inside a component's manifest, one of the Adalo datatypes you can use is the icon datatype.

In order to use icons in Adalo, you must install react-native-vector-icons and import the material icons.

The prop with type icon, when it reaches your component, will simply be a string that's the name of the icon specified in the editor.

Use this example for reference:

// index.js
import React, { Component } from "react";
import Icon from "react-native-vector-icons/MaterialIcons";
class MyComponent extends Component {
render() {
const { icon } = this.props;
return <Icon name={icon} />;

When you set defaults for an icon prop inside your manifest, make sure to use hyphens instead of underscores between words.

Last updated on