gentleface

Gentleface › Layout & interface › form

form icon

Form: form, form builder, web form. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

SVGPNG 16PNG 32PNG 48

Code line-round

SVG
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M1.144 1.856C1.048 1.759 1 1.641 1 1.5C1 1.359 1.048 1.241 1.144 1.144C1.241 1.048 1.359 1 1.5 1L5.5 1C5.641 1 5.759 1.048 5.856 1.144C5.952 1.241 6 1.359 6 1.5C6 1.641 5.952 1.759 5.856 1.856C5.759 1.952 5.641 2 5.5 2L1.5 2C1.359 2 1.241 1.952 1.144 1.856ZM14.707 3.293C14.902 3.488 15 3.724 15 4L15 6C15 6.276 14.902 6.512 14.707 6.707C14.512 6.902 14.276 7 14 7L2 7C1.724 7 1.488 6.902 1.293 6.707C1.098 6.512 1 6.276 1 6L1 4C1 3.724 1.098 3.488 1.293 3.293C1.488 3.098 1.724 3 2 3L14 3C14.276 3 14.512 3.098 14.707 3.293ZM2 6L14 6L14 4L2 4L2 6ZM1.144 9.856C1.048 9.759 1 9.641 1 9.5C1 9.359 1.048 9.241 1.144 9.144C1.241 9.048 1.359 9 1.5 9L5.5 9C5.641 9 5.759 9.048 5.856 9.144C5.952 9.241 6 9.359 6 9.5C6 9.641 5.952 9.759 5.856 9.856C5.759 9.952 5.641 10 5.5 10L1.5 10C1.359 10 1.241 9.952 1.144 9.856ZM14.707 14.707C14.512 14.902 14.276 15 14 15L2 15C1.724 15 1.488 14.902 1.293 14.707C1.098 14.512 1 14.276 1 14L1 12C1 11.724 1.098 11.488 1.293 11.293C1.488 11.098 1.724 11 2 11L14 11C14.276 11 14.512 11.098 14.707 11.293C14.902 11.488 15 11.724 15 12L15 14C15 14.276 14.902 14.512 14.707 14.707ZM14 14L14 12L2 12L2 14L14 14Z"/></svg>
React
// Gentleface "form" (line-round), MIT. https://gentleface.com/icons/form
import type { SVGProps } from 'react';

export function FormIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M1.144 1.856C1.048 1.759 1 1.641 1 1.5C1 1.359 1.048 1.241 1.144 1.144C1.241 1.048 1.359 1 1.5 1L5.5 1C5.641 1 5.759 1.048 5.856 1.144C5.952 1.241 6 1.359 6 1.5C6 1.641 5.952 1.759 5.856 1.856C5.759 1.952 5.641 2 5.5 2L1.5 2C1.359 2 1.241 1.952 1.144 1.856ZM14.707 3.293C14.902 3.488 15 3.724 15 4L15 6C15 6.276 14.902 6.512 14.707 6.707C14.512 6.902 14.276 7 14 7L2 7C1.724 7 1.488 6.902 1.293 6.707C1.098 6.512 1 6.276 1 6L1 4C1 3.724 1.098 3.488 1.293 3.293C1.488 3.098 1.724 3 2 3L14 3C14.276 3 14.512 3.098 14.707 3.293ZM2 6L14 6L14 4L2 4L2 6ZM1.144 9.856C1.048 9.759 1 9.641 1 9.5C1 9.359 1.048 9.241 1.144 9.144C1.241 9.048 1.359 9 1.5 9L5.5 9C5.641 9 5.759 9.048 5.856 9.144C5.952 9.241 6 9.359 6 9.5C6 9.641 5.952 9.759 5.856 9.856C5.759 9.952 5.641 10 5.5 10L1.5 10C1.359 10 1.241 9.952 1.144 9.856ZM14.707 14.707C14.512 14.902 14.276 15 14 15L2 15C1.724 15 1.488 14.902 1.293 14.707C1.098 14.512 1 14.276 1 14L1 12C1 11.724 1.098 11.488 1.293 11.293C1.488 11.098 1.724 11 2 11L14 11C14.276 11 14.512 11.098 14.707 11.293C14.902 11.488 15 11.724 15 12L15 14C15 14.276 14.902 14.512 14.707 14.707ZM14 14L14 12L2 12L2 14L14 14Z" />
    </svg>
  );
}
Vue
Vue: see /icons/form.md
Svelte
Svelte: see /icons/form.md
HTML img
HTML img: see /icons/form.md
CSS
CSS: see /icons/form.md
Data URL
Data URL: see /icons/form.md
Sprite
Sprite: see /icons/form.md
SwiftUI
SwiftUI: see /icons/form.md
Compose
Compose: see /icons/form.md
Android XML
Android XML: see /icons/form.md
Flutter
Flutter: see /icons/form.md

Each SVG is 16 × 16 with fill="currentColor". Keep it at 16 px or an exact multiple (32, 48) on whole pixels: a fractional size or position blurs it. The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. More in how to use.

Meaning

Use it for
form, form builder, web form
Alternatives
  • input-text: a single text field (text-field)
  • poll: a survey or a poll (survey)
Also fits
  • fill in form: the form itself, or a form builder
  • edit form: a form builder, or the form as an object
Tags
form, form builder, web form, fields, inputs, sign up, survey, questionnaire, application form, ui, component, wireframe
Category
Layout & interface
Component name
FormIcon
History
  • added

Family 58

accordionbreadcrumbbreadcrumb-chevronsbrowserbuttoncardscarousel-horizontalcarousel-verticalcolumnscolumns-geardialogdropdown-menu

More layout & interface icons

apps checkbox checkbox-indeterminate checkbox-off command-palette cursor cursor-click cursor-hover cursor-text cursor-user drag-drop grid grip-horizontal grip-vertical hand hand-grab · all layout & interface icons

For agents

Metadata: /icons/form.json · Markdown: /icons/form.md · SVG: https://gentleface.com/svg/{style}/16/form.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/form.png

Feedback