CRENATION β UNIVERSAL INTERFACE DESIGN CONSTITUTION
VERSION 1.0
ABSOLUTE RULE β APPLY TO ALL CRENATION SOFTWARE AND HTML PROJECTS
ββββββββββββββββββββββββββββββββββ
01. CORE DESIGN IDENTITY
ββββββββββββββββββββββββββββββββββ
All software, HTML applications, utilities, tools,
control panels, menus, popup menus, and future projects
created for CRENATION must share a consistent visual identity.
The established CRENATION interface style is the default
and mandatory design language for every new project.
Do not invent an entirely new visual identity for each application.
Maintain the established visual language while adapting
the layout and interaction design to the specific purpose
and functional requirements of each application.
The goal is to make different tools feel like members
of the same carefully designed creative ecosystem.
ββββββββββββββββββββββββββββββββββ
02. COLOR SYSTEM β ABSOLUTE RULE
ββββββββββββββββββββββββββββββββββ
BACKGROUND:
Use near-black, charcoal, and very dark neutral tones
as the foundation of the interface.
PANELS:
Use subtly differentiated dark tones to distinguish
sections, cards, control areas, and functional groups.
PRIMARY ACCENT:
Use vivid fluorescent lime green as the signature
CRENATION accent color.
The accent should be bright, distinctive, and immediately
recognizable against the dark background.
Apply fluorescent lime green selectively to:
- Important headings and labels
- Active selections and selected states
- Primary buttons and important actions
- Key information and status indicators
- Focus indicators and important interface elements
- Other elements that benefit from immediate visual recognition
TEXT:
Use clear, high-contrast text colors.
Primary text should generally use bright off-white
or another highly readable neutral color.
Use fluorescent lime green for emphasis rather than
unnecessarily coloring every text element.
SECONDARY COLORS:
Use restrained neutral tones for secondary information,
borders, dividers, disabled controls, and supporting text.
Avoid introducing unnecessary accent colors
that weaken the established visual identity.
Additional colors may be used when required by the function
of the application, but fluorescent lime green must remain
the recognizable signature accent.
ββββββββββββββββββββββββββββββββββ
03. READABILITY β NON-NEGOTIABLE
ββββββββββββββββββββββββββββββββββ
Visual accessibility and practical readability
are essential design requirements.
The interface must remain comfortable to use
for people with presbyopia and reduced near vision.
Use the following principles:
- Prioritize clear, readable typography.
- Maintain strong contrast between text and background.
- Use fluorescent lime green strategically to improve
Β Β the visibility of important information.
- Avoid unnecessarily small text.
- Avoid thin, low-contrast typography.
- Avoid faint text on dark backgrounds.
- Provide sufficiently large controls and click targets.
- Maintain comfortable spacing between interactive elements.
- Make active states, disabled states, and important actions
Β Β easy to distinguish.
Fluorescent lime green can make small text more noticeable,
but it must never be used as an excuse to reduce font size.
When space is limited, simplify the layout or reorganize
the information before sacrificing readability.
Readability takes priority over decorative sophistication.
ββββββββββββββββββββββββββββββββββ
04. LAYOUT AND VISUAL STRUCTURE
ββββββββββββββββββββββββββββββββββ
Use a restrained, deliberate, contemporary interface style.
Prefer:
- Clear visual hierarchy
- Well-defined functional sections
- Consistent spacing
- Carefully aligned controls
- Clean typography
- Subtle panel differentiation
- Deliberate use of negative space
- Clear separation between primary and secondary actions
Avoid:
- Unnecessary decoration
- Excessive gradients
- Excessive shadows and glow effects
- Unnecessary animation
- Cluttered layouts
- Excessive borders and visual noise
- Decorative elements that interfere with usability
The interface should feel like a sophisticated creative
instrument or experimental control system.
It should be visually distinctive without becoming
visually exhausting.
Do not make every element equally prominent.
Use visual hierarchy to direct attention toward
the most important information and actions.
ββββββββββββββββββββββββββββββββββ
05. FUNCTION BEFORE DECORATION
ββββββββββββββββββββββββββββββββββ
The design must serve the actual purpose of the application.
Do not add interface elements merely to make the screen
look more elaborate.
Do not introduce unnecessary menus, panels, controls,
settings, or decorative components.
If an application requires no main menu, do not invent one.
If a popup menu is sufficient, design the popup menu
using the established CRENATION visual language.
If an application requires a complex control interface,
organize its controls according to their actual functions.
Every interface element should have a clear purpose.
Keep the application as simple as possible
without compromising its intended functionality,
readability, or ease of use.
ββββββββββββββββββββββββββββββββββ
06. PROJECT-SPECIFIC APPLICATION
ββββββββββββββββββββββββββββββββββ
Apply the common design identity according to
the requirements of each project.
DOT-it:
The core application does not require an unnecessary
menu or elaborate interface.
When a popup menu or additional interface is required,
use the CRENATION dark-background and fluorescent-lime
visual language.
MOTION-it:
Apply the same visual identity consistently across
menus, control panels, status indicators, buttons,
settings, and other interface components.
Maintain excellent readability during actual operation.
HTML APPLICATIONS:
Use the established CRENATION visual language across
all HTML-based tools, utilities, prompt generators,
experimental interfaces, and future web applications.
OTHER SOFTWARE:
Apply the same design principles regardless of
programming language, framework, operating system,
or implementation technology.
The exact layout may differ between projects.
The underlying visual identity must remain consistent.
ββββββββββββββββββββββββββββββββββ
07. CONSISTENCY ACROSS PROJECTS
ββββββββββββββββββββββββββββββββββ
Treat the established CRENATION interface style
as a reusable design system, not an isolated theme.
When creating a new application, reuse the established
visual principles rather than starting from zero.
When modifying an existing application, preserve its
existing functional behavior and established visual identity
unless a specific change is explicitly required.
Do not unnecessarily redesign unrelated components.
When adding new controls or sections, make them look
as though they naturally belong to the existing application.
Consistency does not mean every application must have
an identical layout.
It means that different layouts should share
the same recognizable visual language.
ββββββββββββββββββββββββββββββββββ
08. IMPLEMENTATION RULE
ββββββββββββββββββββββββββββββββββ
Before designing or modifying any CRENATION interface,
actively check this constitution.
Do not merely store these rules and then forget them
during implementation.
Apply them when making actual design decisions.
Before delivering the result, verify that:
1. The dark-background foundation is maintained.
2. Fluorescent lime green remains the signature accent.
3. Text and controls are sufficiently readable.
4. The layout is clean and functionally appropriate.
5. Unnecessary visual complexity has been avoided.
6. New components are consistent with the existing design.
7. Project-specific requirements have not been sacrificed
Β Β Β merely to maintain superficial visual uniformity.
8. Existing functionality has not been damaged by
Β Β Β unrelated visual modifications.
If a design decision conflicts with these rules,
follow this constitution unless the project has
an explicitly stated, higher-priority requirement.
ββββββββββββββββββββββββββββββββββ
09. FINAL DESIGN PRINCIPLE
ββββββββββββββββββββββββββββββββββ
CRENATION is not defined by a logo alone.
Its identity is expressed through the consistent
relationship between color, typography, spacing,
layout, readability, and interaction.
A simple interface can be sophisticated.
A technically uncomplicated application can still
demonstrate excellent design judgment.
Do not add complexity merely to demonstrate technical ability.
Create interfaces that are immediately recognizable,
comfortable to use, visually coherent, and appropriate
for the work they are designed to perform.
Preserve the identity.
Respect the function.
Prioritize readability.
Eliminate unnecessary complexity.
ONE VISUAL LANGUAGE.
MANY CREATIVE TOOLS.
CRENATION.