Is the Gradient Headline widget free?

Yes. It is part of the free Master Addons plugin and works with free Elementor, so you do not need Elementor Pro for gradient text.

Can I use more than two colors in the gradient?

No. Each gradient has two color stops, a first Color and a Second Color. Moving the Location sliders changes how sharp or soft the blend is. For three or more colors, add your own CSS to a regular heading.

Will gradient text slow down my website?

No. The gradient is plain CSS on the heading text, so there is no image file to load.

Can the gradient change on hover?

Yes. The Hover tab in Gradient Style has its own colors, locations, type, angle or position, typography, blend mode and text shadow, so the heading can switch to a different gradient when visitors hover it.

무료 Elementor 그라데이션 텍스트 위젯

Elementor의 Heading 위젯은 솔리드 텍스트 색상만 사용하므로 그라디언트 텍스트는 일반적으로 CSS를 작성하는 것을 의미합니다 background-clip: text. 무료 마스터 애드온 플러그인의 그라데이션 헤드라인 위젯은 패널에서 수행합니다. 제목을 입력하고 두 가지 색상을 선택하고 선형 또는 방사형 그라데이션을 선택하고 문자가 채워집니다. 또한 별도의 호버 그라데이션,13 가지 혼합 모드,텍스트 그림자,링크 및 제목 태그의 선택과 영웅 제목,섹션 제목 및 판매 배너에 적합합니다.

Elementor에서 그라디언트 텍스트를 추가하는 방법

Elementor 와 무료 Master Addons 플러그인이 필요합니다. 사용자 정의 CSS 가없고 Elementor Pro 가 없습니다.

설치 및 활성화 WordPress.org 의 마스터 애드온.
Elementor로 페이지를 편집하고 위젯 패널을 검색하세요 그라데이션 헤드라인 그리고 끌어들이세요.
텍스트를 입력하세요 향하고그런 다음 제목 HTML 태그 및 정렬을 설정합니다.
스타일, 그라데이션 스타일에서 첫 번째 색상과 두 번째 색상을 선택하고 위치 슬라이더를 조정합니다.
Linear 를 선택하고 Angle,또는 Radial 을 설정하고 Position 을 설정합니다.
타이포그래피를 설정하고 배경 위에 혼합 모드를 시도한 다음 원하는 경우 호버 그라데이션을 추가하세요.

각 단계의 스크린샷은 다음과 같습니다 그라디언트 텍스트 가이드.

두 가지 색상 선형 또는 방사형 그라데이션

스타일에서는, 그라데이션 스타일, 세트 텍스트 색상 gradient (또는 일반 색상의 경우 Classic) 로. 첫 번째를 선택하십시오 색상 그리고 the 두 번째 색상를 하고, 각각을 움직인다 위치 슬라이더를 사용하여 하나가 다른 것과 혼합되는 위치를 결정합니다. 유형 선형 사이를 전환합니다 각도 (기본적으로 180도는 위에서 아래로 실행됨) 및 방사형은 다음과 같습니다 위치 center Center 와 같은. 텍스트 대신 전체 섹션 뒤로 이동하는 그라데이션에 대해서는 다음을 참조하십시오 애니메이션 그라데이션 BG 확장 (프로).

일반 및 호버 탭: 방문자가 제목을 마우스를 올리면 나타나는 두 번째 그라데이션을 설정합니다.
각 그라디언트는 두 개의 색상 중지를 사용합니다. 세 개 이상의 색상에 대해서는 사용자 정의 CSS 가 필요합니다.
기본값은 보라색 (#9929ea) 에서 빨간색 (#FB083E) 으로 실행되므로 먼저 브랜드 색상으로 변경하십시오.

CSS와 그라데이션 헤드라인을 사용한 요소 제목

CSS 에 익숙하다면 Elementor 의 자체 Heading 위젯으로 그라디언트 텍스트를 만들 수 있습니다. 각 경로에 포함 된 내용은 다음과 같습니다.

특징	요소 제목 + CSS	마스터 애드온 그라데이션 헤드라인
설정	배경 클립으로 CSS 추가: WordPress의 텍스트 추가 CSS, Elementor Pro 사용자 정의 CSS 또는 무료 마스터 애드온 사용자 정의 CSS 확장	패널에서 색상을 선택하세요
그라데이션 유형	세 가지 이상의 색상을 포함하여 CSS가 허용하는 모든 것	선형 또는 방사형, 두 가지 색상 정지
호버 그라데이션	추가 CSS	내장 호버 탭
모드와 그림자를 혼합합니다	추가 CSS	13가지 블렌드 모드와 텍스트 섀도우 컨트롤
가격	CSS를 직접 작성하면 무료입니다	마스터 애드온으로 무료

두 가지 이상의 색상이나 애니메이션 그라데이션이 필요한 경우 CSS 를 작성하십시오. 1 분 안에 시각적으로 설정하려는 경우 그라데이션 헤드라인을 사용하십시오. 관련 무료 위젯: 이중 제목 그리고 애니메이션 헤드라인.

타이포그래피, 혼합 모드 및 텍스트 그림자

각 탭에는 자체 타이포그래피따라서 호버링 시 글꼴, 크기 및 무게도 변경될 수 있습니다. 블렌드 모드 일반, 곱셈, 화면부터 차이와 광도까지 13가지 옵션을 제공하며 그라데이션과 텍스트 뒤의 이미지 또는 색상을 혼합합니다. 텍스트 그림자 색, 흐림 및 오프셋을 추가하여 바쁜 사진에 대한 깊이 또는 가독성을 높입니다.

그라데이션은 순수 CSS이므로 로드할 이미지가 없습니다.
블렌드 모드는 제목 뒤에 있는 모든 것에 반응하므로 실제 배경에서 미리 확인하세요.
가독성을 위해 두 색상과 배경 사이의 대비를 충분히 유지하십시오.

링크, 제목 태그 및 정렬

콘텐츠 탭에서 다음을 추가합니다.In the Content tab, add a 제목 URL 전체 제목을 링크로 만들려면 다음을 선택합니다.To make the whole hading a link. Choose the 제목 HTML 태그 (H1 ~ H6, div, span 또는 p) 제목이 페이지 구조에 맞고 설정됩니다 정렬 왼쪽, 중앙 또는 오른쪽으로.