참조 테마

CSS 에 대한 지식이 없더라도 양식의 스타일을 지정할 수 있습니다. 기본 테마 외에도 AEM-FORMS.-6.3-REFERENCE-THEMES 패키지를 설치하여 다음 테마를 가져올 수 있습니다.

  • Beryl
  • 경영진
  • 경영진-라이트
  • 자유
  • Ultramarine
  • Urbane
  • 미국 웹 디자인 표준
  • 고요함

각 테마에는 사용자에게 적합한 적응형 양식을 만드는 데 사용할 수 있는 독특하고 세련된 스타일이 포함되어 있습니다. 패널, 텍스트 상자, 숫자 상자, 라디오 단추, 표 및 전환과 같은 선택기에 대한 고유한 스타일이 포함되어 있습니다. 이러한 테마의 스타일러스는 요구 사항에 따라 다릅니다. 예를 들어 특정 시나리오에서 깔끔한 글꼴이 포함된 미니멀 테마가 필요합니다. 자유 테마를 사용하면 이러한 모양을 얻을 수 있습니다.

참조 테마

이 패키지에 포함된 테마는 반응형이며, 이러한 테마의 스타일링은 모바일 및 데스크탑 디스플레이에 대해 정의됩니다. 다양한 디바이스의 최신 브라우저에서 이러한 테마 중 하나에 적용된 양식을 간편하게 렌더링할 수 있습니다.

패키지 설치에 대한 자세한 내용은 패키지 사용 방법을 참조하십시오.

Beryl

Beryl 테마는 We.Gov 응용 양식에서 사용되며 배경 이미지, 투명도 및 크고 평평한 아이콘의 사용을 강조합니다. 아래 스크린샷에서는 Beryl 테마가 어떻게 생겼으며 양식 스타일을 향상시키는 방법을 확인할 수 있습니다.
테마
확대하려면 클릭하십시오.

실행

exec 테마는 단색 배경 채우기를 피하고 양식 구성 요소를 강조합니다. 구성 요소를 선택하고 클릭하면 글꼴 색상이 변경됩니다. 기본 캔버스 테마와 비교할 때 선택한 탭의 텍스트 글꼴 색상이 진한 파랑으로 변경됩니다. 내비게이션 및 제출 단추가 Beryl 테마와 어떻게 다른지 확인합니다.
경영진 테마

확대하려면 클릭

실행 라이트

실행 라이트 테마는 공백을 사용하여 원활한 경험을 만듭니다. [다음] 및 [제출] 단추에는 단색 채우기와 3D 그림자가 표시됩니다. 왼쪽의 선택된 탭에는 이중 확인 표시 대신 화살표가 표시됩니다.
실행 밝은 테마

확대하려면 클릭

자유

자유의 테마는 그 중요한 것을 강조하기 위해 미니멀 방식을 사용한다. 예를 들어 방문한 탭의 글꼴 색상이 녹색으로 변경됩니다. 줄과 함께 종이 기반 양식의 모양을 에뮬레이션하는 텍스트 상자의 아래쪽 윤곽선만 볼 수 있습니다. 활성 텍스트 상자에는 아래쪽 윤곽선이 검정 반면 다른 텍스트 상자의 윤곽선은 밝은 회색의 아래쪽 윤곽선이 표시됩니다.
자유 테마

확대하려면 클릭

고요함

조용한 테마는 조용한 색상 구성표의 밝은 및 어두운 음영을 제공하여 양식의 다른 구성 요소를 강조 표시합니다. 예를 들어 라디오 단추, 패널 및 탭은 다른 녹색 음영을 가져옵니다.
조용한 테마

확대하려면 클릭

Ultramarine

Ultramarine 테마는 진한 파란색 음영을 사용하여 탭, 패널, 텍스트 상자 및 버튼과 같은 구성 요소를 강조 표시합니다.
초해양 테마

Urbane

Urbane 테마는 형식에 대한 미니멀리즘 및 기능적인 모양을 강조합니다. Urbent 테마를 양식에 적용하면 구성 요소가 평평하다는 것을 확인할 수 있습니다. 패널에는 얇은 윤곽선이 있어 현대적인 모양을 만들 수 있습니다.
도시 테마

확대하려면 클릭

미국 웹 디자인 표준

U.S. Web Design Standards 테마는 이름에서 알 수 있듯이 Draft US Web Design Standards 사이트에 설명된 서체와 스타일을 사용합니다. 웹 표준은 연방 정부 웹 사이트에서 일관된 웹 경험을 만들기 위해 연방 조직에 의해 사용됩니다.
미국 웹 디자인 표준 테마

확대하려면 클릭

이 페이지에서는

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now