Theme (Dark / Light Mode)

The app supports dark/light mode

To update your colors, go to src/themes/themes.js and update the dark and light colors of your choice:


export const THEMES = [
  {
    key: 'DARK',
    gradientColors: ['#f1662a', '#f1662a', '#be1176', '#d01460'],
    gradientTransparentColors: ['transparent', 'transparent'],
    container: {
      backgroundColor: Black,
      headerTextColor: White,
    },
    primaryColor: White,
    primaryAlphaColor: WhiteAlpha,
    secondaryColor: LightWhite,
    secondarySColor: LLightWhite,
    buttonRed: Red,
    followColor: Red,
    followingColor: FOLLOWING,
    onlineColor: ONLINE,
    linkColor: DARKLINK,
    icons: {
      back: require('./../assets/dark/back.png'),
      close: require('./../assets/dark/close.png'),
      camera: require('./../assets/dark/camera.png'),
      delete: require('./../assets/dark/delete.png'),
      done: require('./../assets/dark/done.png'),
      send: require('./../assets/dark/send.png'),
      setting: require('./../assets/dark/settings.png'),
      options: require('./../assets/dark/options.png'),
      play: require('./../assets/dark/play.png'),
      post: require('./../assets/dark/post.png'),
      search: require('./../assets/dark/search.png'),
      comment: require('./../assets/dark/message.png'),
      unlike: require('./../assets/dark/unlike.png'),
      unmark: require('./../assets/dark/unmark.png'),
      home: require('./../assets/dark/home.png'),
      message: require('./../assets/dark/message.png'),
      activity: require('./../assets/dark/activity.png'),
      profile: require('./../assets/dark/profile.png'),
      like: require('./../assets/light/like.png'),
      mark: require('./../assets/light/mark.png'),
      selectedDone: require('./../assets/light/selectedDone.png'),
      selectedPost: require('./../assets/light/selectedPost.png'),
      selectedSearch: require('./../assets/light/selectedSearch.png'),
      selectedHome: require('./../assets/light/selectedHome.png'),
      selectedMessage: require('./../assets/light/selectedMessage.png'),
      selectedActivity: require('./../assets/light/selectedActivity.png'),
      selectedProfile: require('./../assets/light/selectedProfile.png'),
    }
  },
  {
    key: 'LIGHT',
    gradientColors: ['#f1662a', '#f1662a', '#be1176', '#d01460'],
    gradientTransparentColors: ['transparent', 'transparent'],
    container: {
      backgroundColor: White,
      headerTextColor: Black,
    },
    primaryColor: Black,
    primaryAlphaColor: BlackAlpha,
    secondaryColor: LightBlack,
    secondarySColor: LLightBlack,
    buttonRed: Red,
    followColor: Red,
    followingColor: FOLLOWING,
    onlineColor: ONLINE,
    linkColor: LINK,
    icons: {
      back: require('./../assets/light/back.png'),
      close: require('./../assets/light/close.png'),
      camera: require('./../assets/light/camera.png'),
      delete: require('./../assets/dark/delete.png'),
      done: require('./../assets/light/done.png'),
      send: require('./../assets/light/send.png'),
      setting: require('./../assets/light/settings.png'),
      options: require('./../assets/light/options.png'),
      play: require('./../assets/light/play.png'),
      post: require('./../assets/light/post.png'),
      search: require('./../assets/light/search.png'),
      comment: require('./../assets/light/message.png'),
      unlike: require('./../assets/light/unlike.png'),
      unmark: require('./../assets/light/unmark.png'),
      home: require('./../assets/light/home.png'),
      message: require('./../assets/light/message.png'),
      activity: require('./../assets/light/activity.png'),
      profile: require('./../assets/light/profile.png'),
      like: require('./../assets/light/like.png'),
      mark: require('./../assets/light/mark.png'),
      selectedDone: require('./../assets/light/selectedDone.png'),
      selectedPost: require('./../assets/light/selectedPost.png'),
      selectedSearch: require('./../assets/light/selectedSearch.png'),
      selectedHome: require('./../assets/light/selectedHome.png'),
      selectedMessage: require('./../assets/light/selectedMessage.png'),
      selectedActivity: require('./../assets/light/selectedActivity.png'),
      selectedProfile: require('./../assets/light/selectedProfile.png'),
    }
  },
];

Last updated