Skip to content

817044: Added the Font Color changing by UI in Core and MVC #3801

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
May 2, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
23 changes: 20 additions & 3 deletions ej2-asp-core-mvc/document-editor/text-format.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
layout: post
title: Text Format in ##Platform_Name## Document Editor Component
title: Text Format in ##Platform_Name## Document Editor Component | Syncfusion
description: Learn here all about text format in Syncfusion ##Platform_Name## Document Editor component of Syncfusion Essential JS 2 and more.
platform: ej2-asp-core-mvc
control: Text Format
Expand Down Expand Up @@ -116,6 +116,19 @@ documenteditor.selection.characterFormat.fontSize= 32;

## Color

### Change Font Color by UI Option

In the Document Editor, the Text Properties pane features two icons for managing text color within the user interface (UI):

* **Colored Box:** This icon visually represents the **current color** applied to the selected text.
* **Text (A) Icon:** Clicking this icon allows users **to modify the color** of the selected text by choosing a new color from the available options.

This Font Color option appear as follows.

![Font Color](images/fontColor.PNG)

### Change Font Color by Code

The color of selected text can be get or set using the following code.

```typescript
Expand Down Expand Up @@ -149,7 +162,9 @@ documenteditor.selection.characterFormat.highlightColor= '#FFC0CB';
{% include code-snippet/document-editor/text-format/tagHelper %}
{% endhighlight %}
{% highlight c# tabtitle="Text-format.cs" %}
{% endhighlight %}{% endtabs %}
{% include code-snippet/document-editor/text-format/document-editor.cs %}
{% endhighlight %}
{% endtabs %}

{% elsif page.publishingplatform == "aspnet-mvc" %}

Expand All @@ -158,7 +173,9 @@ documenteditor.selection.characterFormat.highlightColor= '#FFC0CB';
{% include code-snippet/document-editor/text-format/razor %}
{% endhighlight %}
{% highlight c# tabtitle="Text-format.cs" %}
{% endhighlight %}{% endtabs %}
{% include code-snippet/document-editor/text-format/document-editor.cs %}
{% endhighlight %}
{% endtabs %}
{% endif %}


Expand Down