Team design style: Difference between revisions

From SoftPedia
No edit summary
No edit summary
 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
<languages/>
<translate>
Like any respectable team, we have our own design style that reflects our uniqueness and approach to work. We prefer to use deep gray shades, such as <span style="color: #434343; border: 1px solid #fff; padding: 2px;">#434343</span>, <span style="color: #2c2c2c; border: 1px solid #fff; padding: 2px;">#2c2c2c</span>, and <span style="color: #1b1b1b; border: 1px solid #fff; padding: 2px;">#1b1b1b</span>, as our team often works during the night, and bright light can be distracting and uncomfortable during this time. These colors create a calm and focused atmosphere conducive to the creative process and productive work.
Like any respectable team, we have our own design style that reflects our uniqueness and approach to work. We prefer to use deep gray shades, such as <span style="color: #434343; border: 1px solid #fff; padding: 2px;">#434343</span>, <span style="color: #2c2c2c; border: 1px solid #fff; padding: 2px;">#2c2c2c</span>, and <span style="color: #1b1b1b; border: 1px solid #fff; padding: 2px;">#1b1b1b</span>, as our team often works during the night, and bright light can be distracting and uncomfortable during this time. These colors create a calm and focused atmosphere conducive to the creative process and productive work.


Line 7: Line 9:
{| class="wikitable"
{| class="wikitable"
|+
|+
| colspan="5" style="text-align: center;" | Color Palette
| colspan="5" style="text-align: center;" | '''Color Palette'''
|-
|-
|Category
|'''Category'''
|Color Name
|'''Color Name'''
|HEX code
|'''HEX code'''
|RGB Code
|'''RGB Code'''
|Example View
|'''Example View'''
|-
|-
| rowspan="3" | Main Colors
| rowspan="3" | '''Main Colors'''
| Dark Gray:
| Dark Gray
| #434343
| #434343
|67, 67, 67
|67, 67, 67
Line 31: Line 33:
| <div style="width: 20px; height: 20px; background-color: #1b1b1b; display: flex; align-items: center; justify-content: center;"></div>
| <div style="width: 20px; height: 20px; background-color: #1b1b1b; display: flex; align-items: center; justify-content: center;"></div>
|-
|-
| rowspan="2" | Selection Colors
| rowspan="2" | '''Selection Colors'''
| Bright Yellow
| Bright Yellow
| #ffe400
| #ffe400
Line 42: Line 44:
| <div style="width: 20px; height: 20px; background-color: #ff8000; display: flex; align-items: center; justify-content: center;"></div>
| <div style="width: 20px; height: 20px; background-color: #ff8000; display: flex; align-items: center; justify-content: center;"></div>
|-
|-
| rowspan="2" | Additional Text Colors
| rowspan="2" | '''Additional Text Colors'''
| Light Gray
| Light Gray
| #d9d9d9
| #d9d9d9
Line 48: Line 50:
| <div style="width: 20px; height: 20px; background-color: #d9d9d9; display: flex; align-items: center; justify-content: center;"></div>
| <div style="width: 20px; height: 20px; background-color: #d9d9d9; display: flex; align-items: center; justify-content: center;"></div>
|-
|-
| Soft Gray:
| Soft Gray
| #e9eae9
| #e9eae9
|233, 234, 233
|233, 234, 233
| <div style="width: 20px; height: 20px; background-color: #e9eae9; display: flex; align-items: center; justify-content: center;"></div>
| <div style="width: 20px; height: 20px; background-color: #e9eae9; display: flex; align-items: center; justify-content: center;"></div>
|-
|-
| rowspan="2" | Transitional Colors
| rowspan="2" | '''Transitional Colors'''
| Medium Gray
| Medium Gray
| #8c8c8c
| #8c8c8c
Line 59: Line 61:
| <div style="width: 20px; height: 20px; background-color: #8c8c8c; display: flex; align-items: center; justify-content: center;"></div>
| <div style="width: 20px; height: 20px; background-color: #8c8c8c; display: flex; align-items: center; justify-content: center;"></div>
|-
|-
| Warm Beige:
| Warm Beige
| #ffc387
| #ffc387
|255, 195, 135
|255, 195, 135
| <div style="width: 20px; height: 20px; background-color: #ffc387; display: flex; align-items: center; justify-content: center;"></div>
| <div style="width: 20px; height: 20px; background-color: #ffc387; display: flex; align-items: center; justify-content: center;"></div>
|-
|-
| Title Color
| '''Title Color'''
| Pure White
| Pure White
| #FFFFFF
| #FFFFFF
Line 70: Line 72:
| <div style="width: 20px; height: 20px; background-color: #FFFFFF; border: 1px solid #000; display: flex; align-items: center; justify-content: center;"></div>
| <div style="width: 20px; height: 20px; background-color: #FFFFFF; border: 1px solid #000; display: flex; align-items: center; justify-content: center;"></div>
|}
|}
</div>
</translate>
[[Category:Public]]

Latest revision as of 16:44, 5 November 2024

Like any respectable team, we have our own design style that reflects our uniqueness and approach to work. We prefer to use deep gray shades, such as #434343, #2c2c2c, and #1b1b1b, as our team often works during the night, and bright light can be distracting and uncomfortable during this time. These colors create a calm and focused atmosphere conducive to the creative process and productive work.

Our design style not only shapes the visual perception of our projects but also serves as the foundation for building a cohesive brand. Bright accents, such as #ffe400 and #ff8000, are employed to highlight important elements, adding energy and dynamism to our work. Meanwhile, additional shades like #d9d9d9 and #e9eae9 provide balance, enhancing text readability and creating harmony in the overall perception.

Transitional colors, including #8c8c8c and #ffc387, act as connecting elements, establishing smooth transitions between various design components. At the same time, the pure white used for titles (#FFFFFF) adds clarity and modernity, drawing attention to key messages.

Color Palette
Category Color Name HEX code RGB Code Example View
Main Colors Dark Gray #434343 67, 67, 67
Charcoal Gray #2c2c2c 44, 44, 44
Deep Black #1b1b1b 27, 27, 27
Selection Colors Bright Yellow #ffe400 255, 228, 0
Vivid Orange #ff8000 255, 128, 0
Additional Text Colors Light Gray #d9d9d9 217, 217, 217
Soft Gray #e9eae9 233, 234, 233
Transitional Colors Medium Gray #8c8c8c 140, 140, 140
Warm Beige #ffc387 255, 195, 135
Title Color Pure White #FFFFFF 255, 255, 255