diff --git a/src/components/fieldsCreateForm/FieldFooterOptions.js b/src/components/fieldsCreateForm/FieldFooterOptions.js
new file mode 100644
index 0000000000000000000000000000000000000000..f6446f0b9fbd69735a1c055d79c59f301da37250
--- /dev/null
+++ b/src/components/fieldsCreateForm/FieldFooterOptions.js
@@ -0,0 +1,40 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Grid from '@material-ui/core/Grid';
+import Paper from '@material-ui/core/Paper';
+import TextField from '@material-ui/core/TextField';
+import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined';
+import IconButton from '@material-ui/core/IconButton';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import AddCircleIcon from '@material-ui/icons/AddCircle';
+import CloseIcon from '@material-ui/icons/Close';
+import Switch from '@material-ui/core/Switch';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+
+function FieldFooterOptions(props) {
+
+	return (
+			<>
+			<FormControlLabel
+				control={
+				<Switch
+					onChange={e => props.setRequiredField(props.idq) }
+					value="required"
+					color="primary"
+					checked={props.required}
+				/>
+				}
+				label="Obrigatória"
+			/>
+			<IconButton aria-label="delete" onClick={() => { props.deleteFromForm(props.idq) } }>
+				<DeleteOutlinedIcon />
+			</IconButton>
+			</>
+	);
+
+
+}
+
+
+export default FieldFooterOptions;
\ No newline at end of file
diff --git a/src/components/fieldsCreateForm/FormFieldCheckbox.js b/src/components/fieldsCreateForm/FormFieldCheckbox.js
new file mode 100644
index 0000000000000000000000000000000000000000..c4f88cdb7b2f7fd0b3855755d220effae4145d65
--- /dev/null
+++ b/src/components/fieldsCreateForm/FormFieldCheckbox.js
@@ -0,0 +1,98 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Grid from '@material-ui/core/Grid';
+import Paper from '@material-ui/core/Paper';
+import TextField from '@material-ui/core/TextField';
+import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined';
+import IconButton from '@material-ui/core/IconButton';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import AddCircleIcon from '@material-ui/icons/AddCircle';
+import CloseIcon from '@material-ui/icons/Close';
+import Switch from '@material-ui/core/Switch';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';
+
+
+import FieldFooterOptions from './FieldFooterOptions';
+
+
+const useStyles = makeStyles(theme => ({
+  paper: {
+    padding: theme.spacing(3),
+    width: theme.spacing(100),
+    minheight: theme.spacing(16),
+    margin: theme.spacing(2)
+  },
+  questionsGrid: {
+    marginBottom: '20px'
+  },
+}));
+
+
+
+function FormFieldCheckbox(props) {
+  const classes = useStyles();
+
+  return (
+    <Paper className={classes.paper}>
+      <Grid container>
+        <Grid item xs={12} className={classes.questionsGrid}>
+          <TextField value={props.question} label="sua pergunta" 
+                      onChange={e => props.setQuestionField(e.target.value, props.idq)}/>
+        </Grid>
+        <Grid item container
+          direction="column"
+          justify="flex-start"
+          alignItems="flex-start" xs={5} className={classes.questionsGrid}
+        >
+          {
+          props.options.map((x, index) => {
+            return  <Grid container>
+											<Grid item container
+														justify="center"
+														alignItems="center"
+														xs={1}
+											>
+												<CheckBoxOutlineBlankIcon/>
+											</Grid>
+                      <Grid item xs={10}>
+                        <TextField label={"opção "+index} value={x} fullWidth
+                                  onChange={e => props.setSelectOption(e.target.value, props.idq, index)} />
+                      </Grid>
+                      <Grid item xs={1}>
+                        <IconButton aria-label="remove option"
+                                    onClick={() => { props.removeSelectOption(props.idq, index) } }>
+                          <CloseIcon />
+                        </IconButton>
+                      </Grid>
+                    </Grid>
+          })
+          }
+        </Grid>
+        <Grid item container 
+          direction="column"
+          justify="flex-start"
+          alignItems="flex-start"
+          xs={4}
+        >
+          <IconButton aria-label="add option" onClick={() => { props.addSelectOption(props.idq) } }>
+            <AddCircleIcon />
+          </IconButton>
+        </Grid>
+        <Grid item container
+          direction="row"
+          justify="flex-end"
+          alignItems="flex-end"
+          xs={3}
+        >
+          <FieldFooterOptions deleteFromForm={props.deleteFromForm} idq={props.idq}
+                              setRequiredField={props.setRequiredField} required={props.required}/>
+        </Grid>
+      </Grid>
+    </Paper>
+  );
+
+}
+
+export default FormFieldCheckbox;
\ No newline at end of file
diff --git a/src/components/fieldsCreateForm/FormFieldRadio.js b/src/components/fieldsCreateForm/FormFieldRadio.js
new file mode 100644
index 0000000000000000000000000000000000000000..ce10709559547929e966015952f0e48e8dd03d4a
--- /dev/null
+++ b/src/components/fieldsCreateForm/FormFieldRadio.js
@@ -0,0 +1,97 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Grid from '@material-ui/core/Grid';
+import Paper from '@material-ui/core/Paper';
+import TextField from '@material-ui/core/TextField';
+import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined';
+import IconButton from '@material-ui/core/IconButton';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import AddCircleIcon from '@material-ui/icons/AddCircle';
+import CloseIcon from '@material-ui/icons/Close';
+import Switch from '@material-ui/core/Switch';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+import RadioButtonUncheckedIcon from '@material-ui/icons/RadioButtonUnchecked';
+
+import FieldFooterOptions from './FieldFooterOptions';
+
+
+const useStyles = makeStyles(theme => ({
+  paper: {
+    padding: theme.spacing(3),
+    width: theme.spacing(100),
+    minheight: theme.spacing(16),
+    margin: theme.spacing(2)
+  },
+  questionsGrid: {
+    marginBottom: '20px'
+  },
+}));
+
+
+
+function FormFieldRadio(props) {
+  const classes = useStyles();
+
+  return (
+    <Paper className={classes.paper}>
+      <Grid container>
+        <Grid item xs={12} className={classes.questionsGrid}>
+          <TextField value={props.question} label="sua pergunta" 
+                      onChange={e => props.setQuestionField(e.target.value, props.idq)}/>
+        </Grid>
+        <Grid item container
+          direction="column"
+          justify="flex-start"
+          alignItems="flex-start" xs={5} className={classes.questionsGrid}
+        >
+          {
+          props.options.map((x, index) => {
+            return  <Grid container>
+											<Grid item container
+														justify="center"
+														alignItems="center"
+														xs={1}
+											>
+												<RadioButtonUncheckedIcon/>
+											</Grid>
+                      <Grid item xs={10}>
+                        <TextField label={"opção "+index} value={x} fullWidth
+                                  onChange={e => props.setSelectOption(e.target.value, props.idq, index)} />
+                      </Grid>
+                      <Grid item xs={1}>
+                        <IconButton aria-label="remove option"
+                                    onClick={() => { props.removeSelectOption(props.idq, index) } }>
+                          <CloseIcon />
+                        </IconButton>
+                      </Grid>
+                    </Grid>
+          })
+          }
+        </Grid>
+        <Grid item container 
+          direction="column"
+          justify="flex-start"
+          alignItems="flex-start"
+          xs={4}
+        >
+          <IconButton aria-label="add option" onClick={() => { props.addSelectOption(props.idq) } }>
+            <AddCircleIcon />
+          </IconButton>
+        </Grid>
+        <Grid item container
+          direction="row"
+          justify="flex-end"
+          alignItems="flex-end"
+          xs={3}
+        >
+          <FieldFooterOptions deleteFromForm={props.deleteFromForm} idq={props.idq}
+                              setRequiredField={props.setRequiredField} required={props.required} />
+        </Grid>
+      </Grid>
+    </Paper>
+  );
+
+}
+
+export default FormFieldRadio;
\ No newline at end of file
diff --git a/src/components/fieldsCreateForm/FormFieldSelect.js b/src/components/fieldsCreateForm/FormFieldSelect.js
new file mode 100644
index 0000000000000000000000000000000000000000..3158b466acf45f9495309eade1ac2859283e6fb0
--- /dev/null
+++ b/src/components/fieldsCreateForm/FormFieldSelect.js
@@ -0,0 +1,89 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Grid from '@material-ui/core/Grid';
+import Paper from '@material-ui/core/Paper';
+import TextField from '@material-ui/core/TextField';
+import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined';
+import IconButton from '@material-ui/core/IconButton';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import AddCircleIcon from '@material-ui/icons/AddCircle';
+import CloseIcon from '@material-ui/icons/Close';
+import Switch from '@material-ui/core/Switch';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+
+import FieldFooterOptions from './FieldFooterOptions';
+
+
+const useStyles = makeStyles(theme => ({
+  paper: {
+    padding: theme.spacing(3),
+    width: theme.spacing(100),
+    minheight: theme.spacing(16),
+    margin: theme.spacing(2)
+  },
+  questionsGrid: {
+    marginBottom: '20px'
+  },
+}));
+
+
+
+function FormFieldSelect(props) {
+  const classes = useStyles();
+
+  return (
+    <Paper className={classes.paper}>
+      <Grid container>
+        <Grid item xs={12} className={classes.questionsGrid}>
+          <TextField value={props.question} label="sua pergunta" 
+                      onChange={e => props.setQuestionField(e.target.value, props.idq)}/>
+        </Grid>
+        <Grid item container
+          direction="column"
+          justify="flex-start"
+          alignItems="flex-start" xs={5} className={classes.questionsGrid}
+        >
+          {
+          props.options.map((x, index) => {
+            return  <Grid container>
+                      <Grid item xs={11}>
+                        <TextField label={"opção "+index} value={x} fullWidth
+                                  onChange={e => props.setSelectOption(e.target.value, props.idq, index)} />
+                      </Grid>
+                      <Grid item xs={1}>
+                        <IconButton aria-label="remove option"
+                                    onClick={() => { props.removeSelectOption(props.idq, index) } }>
+                          <CloseIcon />
+                        </IconButton>
+                      </Grid>
+                    </Grid>
+          })
+          }
+        </Grid>
+        <Grid item container 
+          direction="column"
+          justify="flex-start"
+          alignItems="flex-start"
+          xs={4}
+        >
+          <IconButton aria-label="add option" onClick={() => { props.addSelectOption(props.idq) } }>
+            <AddCircleIcon />
+          </IconButton>
+        </Grid>
+        <Grid item container
+          direction="row"
+          justify="flex-end"
+          alignItems="flex-end"
+          xs={3}
+        >
+          <FieldFooterOptions deleteFromForm={props.deleteFromForm} idq={props.idq}
+                              setRequiredField={props.setRequiredField} required={props.required} />
+        </Grid>
+      </Grid>
+    </Paper>
+  );
+
+}
+
+export default FormFieldSelect;
\ No newline at end of file
diff --git a/src/components/fieldsCreateForm/FormFieldText.js b/src/components/fieldsCreateForm/FormFieldText.js
new file mode 100644
index 0000000000000000000000000000000000000000..7b032df32bef6d8a69b7730ea78b21821a3dfb85
--- /dev/null
+++ b/src/components/fieldsCreateForm/FormFieldText.js
@@ -0,0 +1,56 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Grid from '@material-ui/core/Grid';
+import Paper from '@material-ui/core/Paper';
+import TextField from '@material-ui/core/TextField';
+import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined';
+import IconButton from '@material-ui/core/IconButton';
+
+import FieldFooterOptions from './FieldFooterOptions';
+
+const useStyles = makeStyles(theme => ({
+  paper: {
+    padding: theme.spacing(3),
+    width: theme.spacing(100),
+    height: theme.spacing(16),
+    margin: theme.spacing(2)
+  },
+  questionsGrid: {
+    marginBottom: '20px'
+  },
+}));
+
+function FormFieldText(props) {
+  const classes = useStyles();
+
+  return (
+    <Paper className={classes.paper}>
+      <Grid container>
+        <Grid item xs={12} className={classes.questionsGrid}>
+          <TextField value={props.question} label="sua pergunta"
+                      onChange={e => props.setQuestionField(e.target.value, props.idq)}/>
+        </Grid>
+        <Grid item xs={9} className={classes.questionsGrid}>
+          <TextField
+            disabled
+            id="outlined-disabled"
+            label=""
+            defaultValue="Resposta curta"
+          />
+        </Grid>
+        <Grid item container
+          direction="row"
+          justify="flex-end"
+          alignItems="flex-end"
+          xs={3}
+        >
+          <FieldFooterOptions deleteFromForm={props.deleteFromForm} idq={props.idq}
+                              setRequiredField={props.setRequiredField} required={props.required} />
+        </Grid>
+      </Grid>
+    </Paper>
+  );
+
+}
+
+export default FormFieldText;
\ No newline at end of file
diff --git a/src/components/fieldsCreateForm/FormFieldTitle.js b/src/components/fieldsCreateForm/FormFieldTitle.js
new file mode 100644
index 0000000000000000000000000000000000000000..019765277d39183f827570683cf2417ca117fc40
--- /dev/null
+++ b/src/components/fieldsCreateForm/FormFieldTitle.js
@@ -0,0 +1,66 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import Grid from '@material-ui/core/Grid';
+import Paper from '@material-ui/core/Paper';
+import TextField from '@material-ui/core/TextField';
+import DeleteOutlinedIcon from '@material-ui/icons/DeleteOutlined';
+import IconButton from '@material-ui/core/IconButton';
+
+import FieldFooterOptions from './FieldFooterOptions';
+
+const useStyles = makeStyles(theme => ({
+  paper: {
+    padding: theme.spacing(3),
+    width: theme.spacing(100),
+    height: theme.spacing(16),
+    margin: theme.spacing(2)
+  },
+  questionsGrid: {
+		marginBottom: '20px'
+	},
+	title: {
+		fontSize: 'xx-large'
+	},
+	description: {
+		fontSize: 'x-large'
+	},
+}));
+
+function FormFieldText(props) {
+  const classes = useStyles();
+
+  return (
+    <Paper className={classes.paper}>
+      <Grid container>
+        <Grid item xs={12} className={classes.questionsGrid}>
+          <TextField value={props.question} label="Formulário sem título" fullWidth 
+                      onChange={e => props.setTitleField(e.target.value, props.idq)}
+											InputProps={{
+												classes: {
+													input: classes.title,
+												},
+											}}/>
+        </Grid>
+        <Grid item xs={9} className={classes.questionsGrid}>
+          <TextField value={props.question} label="Descrição do formulário"
+                      onChange={e => props.setDescriptionField(e.target.value, props.idq)}
+											InputProps={{
+												classes: {
+													input: classes.description,
+												},
+											}}/>
+        </Grid>
+        <Grid item container
+          direction="row"
+          justify="flex-end"
+          alignItems="flex-end"
+          xs={3}
+        >
+        </Grid>
+      </Grid>
+    </Paper>
+  );
+
+}
+
+export default FormFieldText;
\ No newline at end of file