아메리칸 리버 파운데이션

스타일 가이드

이 페이지는 아메리칸 리버 파운데이션 웹 사이트를 방문 하십시오.

색상

이 사이트의 브랜드 색상에 대한 개요입니다.
색상 및 음영
투명 용지
일차
기본
초경량
빛
중급
어두운
울트라 다크
보정
보조
중-고등부
초경량
빛
중급
어두운
울트라 다크
보정
힘
악센트
초경량
빛
중급
어두운
울트라 다크
보정
기지
Base
초경량
빛
중급
어두운
울트라 다크
보정
그늘
그늘
초경량
빛
중급
어두운
울트라 다크
일차
트랜스 10
트랜스 20
트랜스 40
트랜스 60
트랜스 80
트랜스 90
보조
트랜스 10
트랜스 20
트랜스 40
트랜스 60
트랜스 80
트랜스 90
힘
트랜스 10
트랜스 20
트랜스 40
트랜스 60
트랜스 80
트랜스 90
기지
트랜스 10
트랜스 20
트랜스 40
트랜스 60
트랜스 80
트랜스 90
그늘
트랜스 10
트랜스 20
트랜스 40
트랜스 60
트랜스 80
트랜스 90

활판 인쇄술

다음은 이 사이트의 반응형 타이포그래피 크기 및 두께에 대한 개요입니다. 이들은 기본 크기와 수학적 척도에서 계산됩니다.
제목
H1(--xxl)

제목 1 일반

제목 1 매체

제목 1 굵게

H2(--xl)

제목 2 일반

제목 2 매체

제목 2 굵게

H3(--XNUMX)

제목 3 일반

제목 매체

제목 3 굵게

H4(--m)

제목 4 일반

제목 4 매체

제목 4 굵게

H5(--s)
제목 5 일반
제목 매체
제목 5 굵게
H6(--xs)
제목 6 일반
제목 6 매체
제목 6 굵게
본문
본문 텍스트(--m)
텍스트 m 일반
텍스트 m 매체
텍스트 m 굵게
작은 텍스트(--s)
텍스트 레귤러
텍스트 매체
텍스트 굵게
추가 작은 텍스트(--xs)
텍스트 xs 일반
텍스트 XS 중간
텍스트 xs 굵게
예

제목 1(H1)

이것은 큰 텍스트입니다. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

제목 2(H2)

Lorem ipsum dolle 앉아 amet, consipetur adipiscing elit, sed는 시간 낭비하지 않고 노동 및 magnolia aliqua. 최소한의 노력으로 그 결과를 산출 할 수 있습니다.

제목 3(H3)

Lorem ipsum dolle 앉아 amet, consipetur adipiscing elit, sed는 시간 낭비하지 않고 노동 및 magnolia aliqua. 최소한의 노력으로 그 결과를 산출 할 수 있습니다.

제목 4(H4)

Lorem ipsum dolle 앉아 amet, consipetur adipiscing elit, sed는 시간 낭비하지 않고 노동 및 magnolia aliqua. 최소한의 노력으로 그 결과를 산출 할 수 있습니다.
제목 5(H5)
Lorem ipsum dolle 앉아 amet, consipetur adipiscing elit, sed는 시간 낭비하지 않고 노동 및 magnolia aliqua. 최소한의 노력으로 그 결과를 산출 할 수 있습니다.
제목 6(H6)
Lorem ipsum dolle 앉아 amet, consipetur adipiscing elit, sed는 시간 낭비하지 않고 노동 및 magnolia aliqua. 최소한의 노력으로 그 결과를 산출 할 수 있습니다.

버튼

단색 및 윤곽선 버튼은 흑백을 포함한 모든 색상 세트에서 사용할 수 있습니다.
밝은 배경의 버튼
기본
기본 개요
중-고등부보조 개요
악센트
악센트 개요Base
베이스 아웃라인
어두운 배경의 버튼
기본
기본 개요
중-고등부보조 개요
악센트
악센트 개요백
화이트 아웃 라인
버튼 스케일
버튼 XS
btn--기본 / btn--xs
버튼 S
btn--기본 / btn--xs
M 버튼
btn--기본 / btn--m
버튼 L
btn--기본 / btn--l
버튼 XL
btn--기본 / btn--xl
버튼 XXL
btn--기본 / btn--xxl

폭

요소 너비를 제어하는 ​​데 사용할 수 있는 XNUMX개의 값이 있습니다. 자동으로 반응합니다.
--폭-xs
--폭-s
--폭-m
--너비-l
--너비-xl
--폭-xxl

섹션 패딩

섹션의 패딩은 반응형이며 코어 간격 시스템의 승수를 기반으로 합니다.
없음
XS
S
M
L
XL
XXL

간격

기본 크기와 수학적 척도에서 계산된 반응 간격에는 XNUMX가지 수준이 있습니다. 이렇게 하면 마진, 패딩 및 간격이 모두 완벽하게 일치합니다.
--공간 xs
--공간-s
--공간-m
--공간-l
--공간-xl
--공간-xxl

요소 패딩

다음은 패딩으로 시각화된 XNUMX단계 간격입니다.

카드

XS 패딩이 있는 카드입니다. 그 내용은 가장자리에 꽤 가깝습니다.

카드

이것은 S 패딩이 있는 카드입니다. 약간 더 단단한 패딩이 있습니다.

카드

M 패딩이 있는 카드입니다. 표준 호흡 공간이 있습니다.

카드

이것은 L 패딩이 있는 카드입니다. 여분의 호흡 공간이 있습니다.

카드

XL 패딩이 있는 카드입니다. 상당한 호흡 공간이 있습니다.

카드

이것은 XXL 패딩이 있는 카드입니다. 밀폐된 공간에서 사용하지 마십시오.

그림자

선택할 수 있는 XNUMX개의 다층 상자 그림자가 있습니다.
박스 섀도우 M
박스 섀도우 L
박스 섀도우 XL

테두리 반경

기본 크기와 수학적 배율에서 계산된 XNUMX개의 테두리 반경 값이 있습니다.
둥근 XS
둥근 S
반올림 M
반올림 L
둥근 XL
둥근 XXL